@jskit-ai/assistant-core 0.2.3 → 0.2.4

package/examples/conversation/package.json

@@ -8,7 +8,7 @@
     "build": "vite build"
   },
   "dependencies": {
-    "@jskit-ai/assistant-core": "0.2.3",
+    "@jskit-ai/assistant-core": "0.2.4",
     "@jskit-ai/http-runtime": "0.2.1",
     "@jskit-ai/kernel": "0.2.1",
     "@mdi/js": "^7.4.47",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jskit-ai/assistant-core",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "type": "module",
   "scripts": {
     "test": "node --test --test-concurrency=1"

package/src/client/conversation/AssistantTranscript.vue

@@ -447,6 +447,7 @@ let retainedReaderScrollSnapshot = null;
 let loadMoreRequestVersion = 0;
 let pendingTailFollow = false;
 let previousScrollTop = 0;
+let previousScrollHeight = 0;
 let userScrollIntentUpward = false;
 let lastTouchY = null;
 const USER_SCROLL_INTENT_RESET_MS = 600;
@@ -881,11 +882,17 @@ function updateLatestFollowFromScroll(event = {}) {
   const target = event?.currentTarget || bodyElement.value;
   if (retainedReaderScrollSnapshot?.restoring) {
     previousScrollTop = target?.scrollTop || 0;
+    previousScrollHeight = target?.scrollHeight || 0;
     return;
   }
   const scrollTop = target?.scrollTop || 0;
+  const scrollHeight = target?.scrollHeight || 0;
   const scrolledUp = scrollTop < previousScrollTop;
+  // Layout changes such as scroll anchoring move scrollTop together with the
+  // content height; moving up over unchanged content is the reader's own.
+  const readerMovedUp = scrolledUp && scrollHeight === previousScrollHeight;
   previousScrollTop = scrollTop;
+  previousScrollHeight = scrollHeight;
   // Keep following the reader while the request is pending, before rows prepend.
   if (loadMoreScrollSnapshot && !loadMoreScrollSnapshot.completed) {
     loadMoreScrollSnapshot.scrollTop = scrollTop;
@@ -897,7 +904,7 @@ function updateLatestFollowFromScroll(event = {}) {
   const userScrollsUp = userScrollIntent.value && userScrollIntentUpward;
   const shouldFollow = scrollElementNearBottom(target) &&
     !(userScrollsUp && scrollDistanceFromBottom(target) > 1);
-  if (!shouldFollow && !userScrollIntent.value && followingLatest.value) {
+  if (!shouldFollow && !userScrollIntent.value && !readerMovedUp && followingLatest.value) {
     return;
   }
   followingLatest.value = shouldFollow;

package/test/assistantScroll.browser.test.js

@@ -51,6 +51,30 @@ async function scrollGesture(body, lastEventType, perform) {
   await body.evaluate(element => element.gestureScrollEnded);
 }
 
+// Chromium animates a keyboard scroll towards a target fixed at the key press
+// while content-visibility rows keep changing the transcript's height, so the
+// animation can stop short of the end or not move at all. Keep the real key
+// event for the transcript's own handling, replace only the browser's scroll
+// with a move to `target` ("end", "top" or a pixel offset), and wait until the
+// transcript has handled that scroll.
+async function pressScrollKey(body, key, target) {
+  await body.evaluate((element, [scrollKey, scrollTarget]) => {
+    element.keyScrolled = new Promise(resolve => {
+      element.addEventListener("keydown", function move(event) {
+        if (event.key !== scrollKey) return;
+        element.removeEventListener("keydown", move);
+        event.preventDefault();
+        element.addEventListener("scroll", () => resolve(), { once: true });
+        element.scrollTop = scrollTarget === "end"
+          ? element.scrollHeight
+          : scrollTarget === "top" ? 0 : element.scrollTop + scrollTarget;
+      });
+    });
+  }, [key, target]);
+  await body.press(key);
+  await body.evaluate(element => element.keyScrolled);
+}
+
 const VIEWPORTS = Object.freeze([
   Object.freeze({ name: "phone", width: 390, height: 844 }),
   Object.freeze({ name: "compact", width: 800, height: 900 }),
@@ -428,13 +452,12 @@ test("upward scrolling loads older history once and preserves retry and selectio
       await expect(requests).toHaveText("History requests: 1");
 
       // Keyboard navigation also requests older history.
-      await body.focus();
-      await body.press("Home");
+      await pressScrollKey(body, "Home", "top");
       await expect(requests).toHaveText("History requests: 2");
       await external("Fail history load");
       await expect(page.getByText("History unavailable", { exact: true })).toBeVisible();
-      await body.press("ArrowDown");
-      await body.press("Home");
+      await pressScrollKey(body, "ArrowDown", 40);
+      await pressScrollKey(body, "Home", "top");
       await expect(requests).toHaveText("History requests: 2");
       await page.getByRole("button", { name: "Load older messages", exact: true }).click();
       await expect(requests).toHaveText("History requests: 3");
@@ -445,16 +468,12 @@ test("upward scrolling loads older history once and preserves retry and selectio
       await expect(page.getByText("Conversation line 70:", { exact: false })).toBeVisible();
       await expect(requests).toHaveText("History requests: 3");
       await external("Exhaust history");
-      // Removing the history control re-anchors the scroller, which would
-      // cancel a keyboard scroll already in flight; press Home once it settles.
+      // Removing the history control re-anchors the scroller; press Home once
+      // it settles.
       await expect(page.getByRole("button", { name: "Load older messages", exact: true })).toHaveCount(0);
       await settleLayout(body);
-      await expect.poll(async () => {
-        await body.focus();
-        return body.evaluate(element => document.activeElement === element);
-      }).toBe(true);
-      await body.press("Home");
-      await expect.poll(() => body.evaluate(element => element.scrollTop)).toBe(0);
+      await pressScrollKey(body, "Home", "top");
+      expect(await body.evaluate(element => element.scrollTop)).toBe(0);
       await expect(requests).toHaveText("History requests: 3");
       assert.ok(await page.evaluate(() => document.documentElement.scrollWidth <= innerWidth));
       assert.deepEqual(errors, []);
@@ -519,24 +538,21 @@ test("a reader's own upward scrolling leaves the latest message from its first f
       expect(await fromBottom()).toBeGreaterThan(1);
 
       // Returning to the end resumes following new replies.
-      await body.press("End");
-      await expect.poll(fromBottom).toBeLessThanOrEqual(1);
+      await pressScrollKey(body, "End", "end");
       await appendReply();
       expect(await fromBottom()).toBeLessThanOrEqual(1);
 
-      // The first frame of an upward scroll lands inside the follow threshold;
-      // the rest of it (a fling or smooth scroll) moves the reader into history
-      // without further input events.
-      await body.press("ArrowUp");
-      await expect.poll(fromBottom).toBeGreaterThan(1);
-      await settleLayout(body);
-      expect(await fromBottom()).toBeLessThanOrEqual(48);
+      // The first frame of an upward keyboard scroll lands inside the follow
+      // threshold; the rest of it (a fling or smooth scroll) moves the reader
+      // into history without further input events.
+      await pressScrollKey(body, "ArrowUp", -10);
+      const firstFrame = await fromBottom();
+      assert.ok(firstFrame > 1 && firstFrame <= 48, `first frame ${firstFrame}px from the end`);
       await body.evaluate(element => { element.scrollTop = Math.round(element.scrollTop / 2); });
       await settleLayout(body);
       await appendReply();
       expect(await fromBottom()).toBeGreaterThan(1_000);
-      await body.press("End");
-      await expect.poll(fromBottom).toBeLessThanOrEqual(1);
+      await pressScrollKey(body, "End", "end");
       await appendReply();
       expect(await fromBottom()).toBeLessThanOrEqual(1);
 
@@ -546,8 +562,7 @@ test("a reader's own upward scrolling leaves the latest message from its first f
       await body.evaluate(element => {
         element.addEventListener("keydown", () => element.dispatchEvent(new Event("scroll")), { once: true });
       });
-      await body.press("Home");
-      await expect.poll(() => body.evaluate(element => element.scrollTop)).toBe(0);
+      await pressScrollKey(body, "Home", "top");
       await appendReply();
       expect(await body.evaluate(element => element.scrollTop)).toBe(0);
       assert.deepEqual(errors, []);
@@ -559,6 +574,57 @@ test("a reader's own upward scrolling leaves the latest message from its first f
   }
 });
 
+test("a reader moved away from the end without a scroll direction stays there", {
+  skip: !RUN_BROWSER_TEST,
+  timeout: 60_000
+}, async () => {
+  const vite = await startViteFixture({ fixtureRoot: FIXTURE_ROOT });
+  const browser = await chromium.launch(createChromiumLaunchOptions());
+  try {
+    const page = await browser.newPage({ viewport: { width: 1365, height: 900 } });
+    const errors = [];
+    page.on("pageerror", error => errors.push(error.message));
+    await page.goto(`${vite.baseURL}/?controls=1&history=1`);
+    const body = page.locator(".assistant-transcript__body");
+    const fromBottom = () => body.evaluate(element => element.scrollHeight - element.clientHeight - element.scrollTop);
+    // Move the reader and wait until the transcript has handled the scroll.
+    const moveReader = target => body.evaluate((element, by) => new Promise(resolve => {
+      element.addEventListener("scroll", () => resolve(), { once: true });
+      element.scrollTop = by === "end" ? element.scrollHeight : element.scrollTop + by;
+    }), target);
+    const appendReply = async () => {
+      const replies = page.getByText("New reply.", { exact: false });
+      const count = await replies.count();
+      await page.getByRole("button", { name: "Append reply", exact: true }).evaluate(element => element.click());
+      await expect(replies).toHaveCount(count + 1);
+      await settleLayout(body);
+    };
+    await expect(page.getByText("Conversation line 70:", { exact: false })).toBeVisible();
+    await page.getByRole("button", { name: "Exhaust history", exact: true }).evaluate(element => element.click());
+    await settleLayout(body);
+    expect(await fromBottom()).toBeLessThanOrEqual(1);
+
+    // A scrollbar drag starts on the scroller itself and carries no scroll
+    // direction; its frames, the first inside the follow threshold, then move
+    // the reader without further input. Headless Chromium hides scrollbars, so
+    // the drag's pointerdown is dispatched directly.
+    await body.evaluate(element => element.dispatchEvent(new PointerEvent("pointerdown", { bubbles: true })));
+    await moveReader(-10);
+    await moveReader(-300);
+    await appendReply();
+    expect(await fromBottom()).toBeGreaterThan(300);
+
+    // Returning to the end resumes following new replies.
+    await moveReader("end");
+    await appendReply();
+    expect(await fromBottom()).toBeLessThanOrEqual(1);
+    assert.deepEqual(errors, []);
+  } finally {
+    await browser.close();
+    await stopProcess(vite);
+  }
+});
+
 test("retained hidden transcripts preserve readers and follow only at the latest message", {
   skip: !RUN_BROWSER_TEST,
   timeout: 90_000