@fairyhunter13/opentui-core 0.1.88 → 0.1.90

package/src/tests/runtime-plugin-support.test.ts

@@ -0,0 +1,28 @@
+import { describe, expect, it } from "bun:test"
+import { join } from "node:path"
+
+describe("runtime plugin support", () => {
+  it("installs exactly once via drop-in module", () => {
+    const fixturePath = join(import.meta.dir, "runtime-plugin-support.fixture.ts")
+    const result = Bun.spawnSync([process.execPath, fixturePath], {
+      cwd: join(import.meta.dir, "..", ".."),
+      stdout: "pipe",
+      stderr: "pipe",
+      env: process.env,
+    })
+
+    const stdout = result.stdout.toString().trim()
+    const stderr = result.stderr.toString().trim()
+
+    if (stdout) {
+      console.debug(`[runtime-plugin-support.fixture] stdout:\n${stdout}`)
+    }
+
+    if (stderr) {
+      console.debug(`[runtime-plugin-support.fixture] stderr:\n${stderr}`)
+    }
+
+    expect(result.exitCode).toBe(0)
+    expect(stdout).toContain("idempotent=true")
+  })
+})

package/src/tests/runtime-plugin.fixture.ts

@@ -0,0 +1,40 @@
+import { mkdtempSync, rmSync, writeFileSync } from "node:fs"
+import { tmpdir } from "node:os"
+import { join } from "node:path"
+import { plugin as registerPlugin } from "bun"
+import { createRuntimePlugin } from "../runtime-plugin"
+
+const tempRoot = mkdtempSync(join(tmpdir(), "core-runtime-plugin-fixture-"))
+const entryPath = join(tempRoot, "entry.ts")
+
+const source = [
+  'import { marker as coreMarker } from "@opentui/core"',
+  'import { createTestRenderer } from "@opentui/core/testing"',
+  'import { value as syncValue } from "fixture-sync"',
+  'import { value as asyncValue } from "@fixture/async-module"',
+  "console.log(`core=${coreMarker};coreTesting=${typeof createTestRenderer === 'function'};sync=${syncValue};async=${asyncValue}`)",
+  "export const noop = 1",
+].join("\n")
+
+writeFileSync(entryPath, source)
+
+registerPlugin.clearAll()
+
+registerPlugin(
+  createRuntimePlugin({
+    core: {
+      marker: "core-value",
+    },
+    additional: {
+      "fixture-sync": { value: "sync-value" },
+      "@fixture/async-module": async () => ({ value: "async-value" }),
+    },
+  }),
+)
+
+try {
+  await import(entryPath)
+} finally {
+  registerPlugin.clearAll()
+  rmSync(tempRoot, { recursive: true, force: true })
+}

package/src/tests/runtime-plugin.test.ts

@@ -0,0 +1,190 @@
+import { describe, expect, it } from "bun:test"
+import { join } from "node:path"
+import * as coreRuntime from "../index"
+import { createRuntimePlugin, runtimeModuleIdForSpecifier } from "../runtime-plugin"
+
+type ResolveResult = { path: string; namespace?: string } | void
+type ResolveCallback = (args: { path: string; importer: string }) => ResolveResult | Promise<ResolveResult>
+type LoadCallback = (args: { path: string }) => unknown | Promise<unknown>
+type ModuleCallback = () => unknown | Promise<unknown>
+
+type ResolveHandler = {
+  filter: RegExp
+  callback: ResolveCallback
+}
+
+type MockBuild = {
+  onResolve: (args: { filter: RegExp }, callback: ResolveCallback) => void
+  onLoad: (args: { filter: RegExp }, callback: LoadCallback) => void
+  module: (path: string, callback: ModuleCallback) => void
+}
+
+const createMockBuild = (): {
+  build: MockBuild
+  resolveHandlers: ResolveHandler[]
+  modules: Map<string, ModuleCallback>
+} => {
+  const resolveHandlers: ResolveHandler[] = []
+  const modules = new Map<string, ModuleCallback>()
+
+  const build: MockBuild = {
+    onResolve(args, callback) {
+      resolveHandlers.push({ filter: args.filter, callback })
+    },
+    onLoad() {
+      return
+    },
+    module(path, callback) {
+      modules.set(path, callback)
+    },
+  }
+
+  return { build, resolveHandlers, modules }
+}
+
+const resolveSpecifier = async (handlers: ResolveHandler[], specifier: string): Promise<ResolveResult> => {
+  for (const handler of handlers) {
+    if (!handler.filter.test(specifier)) continue
+
+    const result = await handler.callback({
+      path: specifier,
+      importer: import.meta.path,
+    })
+
+    if (result) {
+      return result
+    }
+  }
+
+  return undefined
+}
+
+describe("runtime plugin", () => {
+  it("registers core runtime modules by default", async () => {
+    const { build, resolveHandlers, modules } = createMockBuild()
+    createRuntimePlugin().setup(build as any)
+
+    const coreResolution = await resolveSpecifier(resolveHandlers, "@opentui/core")
+    const core3dResolution = await resolveSpecifier(resolveHandlers, "@opentui/core/3d")
+    const coreTestingResolution = await resolveSpecifier(resolveHandlers, "@opentui/core/testing")
+
+    expect(coreResolution).toEqual({ path: runtimeModuleIdForSpecifier("@opentui/core") })
+    expect(core3dResolution).toEqual({ path: runtimeModuleIdForSpecifier("@opentui/core/3d") })
+    expect(coreTestingResolution).toEqual({ path: runtimeModuleIdForSpecifier("@opentui/core/testing") })
+
+    if (!coreResolution || !core3dResolution || !coreTestingResolution) {
+      throw new Error("Expected core runtime module resolutions")
+    }
+
+    const coreModuleFactory = modules.get(coreResolution.path)
+    const core3dModuleFactory = modules.get(core3dResolution.path)
+    const coreTestingModuleFactory = modules.get(coreTestingResolution.path)
+
+    expect(coreModuleFactory).toBeDefined()
+    expect(core3dModuleFactory).toBeDefined()
+    expect(coreTestingModuleFactory).toBeDefined()
+
+    if (!coreModuleFactory || !core3dModuleFactory || !coreTestingModuleFactory) {
+      throw new Error("Expected core runtime module factories")
+    }
+
+    expect(await coreModuleFactory()).toEqual({
+      exports: coreRuntime as Record<string, unknown>,
+      loader: "object",
+    })
+
+    const coreTestingModule = (await coreTestingModuleFactory()) as {
+      exports: Record<string, unknown>
+      loader: string
+    }
+
+    expect(coreTestingModule.loader).toBe("object")
+    expect(typeof coreTestingModule.exports.createTestRenderer).toBe("function")
+  })
+
+  it("registers additional runtime modules with sync and async loaders", async () => {
+    const { build, resolveHandlers, modules } = createMockBuild()
+
+    createRuntimePlugin({
+      core: { marker: "core" },
+      additional: {
+        "fixture-sync": { value: "sync-value" },
+        "@fixture/async-module": async () => ({ value: "async-value" }),
+      },
+    }).setup(build as any)
+
+    const coreResolution = await resolveSpecifier(resolveHandlers, "@opentui/core")
+    const syncResolution = await resolveSpecifier(resolveHandlers, "fixture-sync")
+    const asyncResolution = await resolveSpecifier(resolveHandlers, "@fixture/async-module")
+
+    expect(coreResolution).toEqual({ path: runtimeModuleIdForSpecifier("@opentui/core") })
+    expect(syncResolution).toEqual({ path: runtimeModuleIdForSpecifier("fixture-sync") })
+    expect(asyncResolution).toEqual({ path: runtimeModuleIdForSpecifier("@fixture/async-module") })
+
+    if (!coreResolution || !syncResolution || !asyncResolution) {
+      throw new Error("Expected runtime module resolutions")
+    }
+
+    const coreModuleFactory = modules.get(coreResolution.path)
+    const syncModuleFactory = modules.get(syncResolution.path)
+    const asyncModuleFactory = modules.get(asyncResolution.path)
+
+    expect(coreModuleFactory).toBeDefined()
+    expect(syncModuleFactory).toBeDefined()
+    expect(asyncModuleFactory).toBeDefined()
+
+    if (!coreModuleFactory || !syncModuleFactory || !asyncModuleFactory) {
+      throw new Error("Expected runtime module factories")
+    }
+
+    expect(await coreModuleFactory()).toEqual({ exports: { marker: "core" }, loader: "object" })
+    expect(await syncModuleFactory()).toEqual({ exports: { value: "sync-value" }, loader: "object" })
+    expect(await asyncModuleFactory()).toEqual({ exports: { value: "async-value" }, loader: "object" })
+  })
+
+  it("escapes exact-match resolver filters for special characters", async () => {
+    const { build, resolveHandlers } = createMockBuild()
+
+    createRuntimePlugin({
+      additional: {
+        "fixture.with.dot": { value: "dot-value" },
+      },
+    }).setup(build as any)
+
+    const exactMatch = await resolveSpecifier(resolveHandlers, "fixture.with.dot")
+    const nonMatch = await resolveSpecifier(resolveHandlers, "fixtureXwithXdot")
+
+    expect(exactMatch).toEqual({ path: runtimeModuleIdForSpecifier("fixture.with.dot") })
+    expect(nonMatch).toBeUndefined()
+  })
+
+  it("encodes runtime module IDs deterministically", () => {
+    expect(runtimeModuleIdForSpecifier("@opentui/core/testing")).toBe(
+      "opentui:runtime-module:%40opentui%2Fcore%2Ftesting",
+    )
+  })
+
+  it("resolves runtime modules end-to-end in a subprocess", () => {
+    const fixturePath = join(import.meta.dir, "runtime-plugin.fixture.ts")
+    const result = Bun.spawnSync([process.execPath, fixturePath], {
+      cwd: join(import.meta.dir, "..", ".."),
+      stdout: "pipe",
+      stderr: "pipe",
+      env: process.env,
+    })
+
+    const stdout = result.stdout.toString().trim()
+    const stderr = result.stderr.toString().trim()
+
+    if (stdout) {
+      console.debug(`[runtime-plugin.fixture] stdout:\n${stdout}`)
+    }
+
+    if (stderr) {
+      console.debug(`[runtime-plugin.fixture] stderr:\n${stderr}`)
+    }
+
+    expect(result.exitCode).toBe(0)
+    expect(stdout).toContain("core=core-value;coreTesting=true;sync=sync-value;async=async-value")
+  })
+})

package/src/tests/scrollbox-culling-bug.test.ts

@@ -0,0 +1,114 @@
+import { test, expect, beforeEach, afterEach } from "bun:test"
+import { createTestRenderer, type TestRenderer } from "../testing.js"
+import { ManualClock } from "../testing/manual-clock.js"
+import { ScrollBoxRenderable } from "../renderables/ScrollBox.js"
+import { BoxRenderable } from "../renderables/Box.js"
+import { TextRenderable } from "../renderables/Text.js"
+import { TestRecorder } from "../testing/test-recorder.js"
+
+let testRenderer: TestRenderer
+let renderOnce: () => Promise<void>
+let clock: ManualClock
+
+beforeEach(async () => {
+  clock = new ManualClock()
+  ;({ renderer: testRenderer, renderOnce } = await createTestRenderer({ width: 50, height: 12, clock }))
+})
+
+afterEach(() => {
+  testRenderer.destroy()
+})
+
+test("scrollbox culling issue: last item not visible in frame after content grows with stickyScroll", async () => {
+  // ISSUE: During updateLayout, when content.onSizeChange triggers recalculateBarProps,
+  // it changes translateY via the scrollbar onChange callback. Then _getVisibleChildren()
+  // is called for culling, but it uses the NEW translateY value with OLD child layout
+  // positions (since children haven't had updateFromLayout called yet). This causes
+  // incorrect culling where the last item is not rendered even though it should be visible.
+
+  // Container box with border to see constraints clearly
+  const container = new BoxRenderable(testRenderer, {
+    width: 48,
+    height: 10,
+    border: true,
+  })
+  testRenderer.root.add(container)
+
+  const scrollBox = new ScrollBoxRenderable(testRenderer, {
+    width: "100%",
+    height: "100%",
+    stickyScroll: true,
+    stickyStart: "bottom",
+  })
+  container.add(scrollBox)
+
+  const recorder = new TestRecorder(testRenderer)
+  recorder.rec()
+
+  for (let i = 0; i < 50; i++) {
+    const item = new BoxRenderable(testRenderer, {
+      id: `item-${i}`,
+      height: 3,
+      border: true,
+    })
+
+    const text = new TextRenderable(testRenderer, {
+      content: `Item ${i}`,
+    })
+    item.add(text)
+
+    scrollBox.add(item)
+    await renderOnce()
+  }
+
+  // Advance clock to trigger any pending re-render scheduled by stickyScroll's requestRender()
+  clock.advance(100)
+  await renderOnce()
+
+  recorder.stop()
+
+  const frames = recorder.recordedFrames
+
+  // With stickyScroll to bottom, there should NEVER be empty space at the bottom
+  // when there are items available to render
+
+  for (let frameIdx = 0; frameIdx < frames.length; frameIdx++) {
+    const frame = frames[frameIdx].frame
+    const lines = frame.split("\n")
+
+    const containerStart = lines.findIndex((line) => line.startsWith("┌"))
+    const containerEnd = containerStart + 10 - 1
+
+    if (containerStart >= 0 && containerEnd > containerStart && containerEnd < lines.length) {
+      const contentLines = lines.slice(containerStart + 1, containerEnd)
+
+      let emptyLinesAtBottom = 0
+
+      for (let i = contentLines.length - 1; i >= 0; i--) {
+        const line = contentLines[i]
+        const content = line.replace(/^[│\s]*/, "").replace(/[│█▄\s]*$/, "")
+
+        if (content.length === 0) {
+          emptyLinesAtBottom++
+        } else {
+          break
+        }
+      }
+
+      const expectedItems = frameIdx + 1
+
+      // With stickyScroll to bottom, once we have enough items to fill the viewport,
+      // there should be NO empty space at the bottom
+      // Viewport is 8 lines (10 - 2 for borders), items are 3 lines each
+      // So with 3+ items (9 lines of content), we should always fill the viewport
+      if (expectedItems >= 3) {
+        expect(emptyLinesAtBottom).toBe(0)
+      }
+    }
+  }
+
+  // With stickyScroll to bottom, the last item should be visible after all items are added
+  const finalFrame = frames[frames.length - 1].frame
+  const hasItem49 = finalFrame.includes("Item 49")
+  expect(hasItem49).toBe(true)
+})

package/src/tests/scrollbox-hitgrid-resize.test.ts

@@ -0,0 +1,136 @@
+import { test, expect } from "bun:test"
+import { createTestRenderer, type MockMouse, type TestRenderer } from "../testing.js"
+import { ScrollBoxRenderable } from "../renderables/ScrollBox.js"
+import { BoxRenderable } from "../renderables/Box.js"
+import { Renderable } from "../Renderable.js"
+
+test("hit grid works at all Y coordinates after terminal shrink", async () => {
+  // Start wide: 160x50 = 8000 cells
+  const { renderer, mockMouse, resize } = await createTestRenderer({
+    width: 160,
+    height: 50,
+  })
+
+  const scrollBox = new ScrollBoxRenderable(renderer, {
+    width: "100%",
+    height: "100%",
+    scrollY: true,
+  })
+  renderer.root.add(scrollBox)
+
+  const items: BoxRenderable[] = []
+  for (let i = 0; i < 200; i++) {
+    const item = new BoxRenderable(renderer, {
+      id: `item-${i}`,
+      height: 2,
+    })
+    items.push(item)
+    scrollBox.add(item)
+  }
+
+  await renderer.idle()
+
+  // Verify hit grid works at the original size
+  const hitBefore = renderer.hitTest(5, 10)
+  expect(hitBefore).not.toBe(0)
+
+  // Shrink to narrow+tall: 60x100 = 6000 cells (smaller total area)
+  resize(60, 100)
+  renderer.root.resize(60, 100)
+  await renderer.idle()
+
+  // Row 70 is beyond the old height (50). Before the fix, checkHit
+  // returned 0 here because hitGridHeight was still 50.
+  const hitAtRow70 = renderer.hitTest(5, 70)
+  expect(hitAtRow70).not.toBe(0)
+
+  // Row 95 -- near the bottom of the new terminal
+  const hitAtRow95 = renderer.hitTest(5, 95)
+  expect(hitAtRow95).not.toBe(0)
+
+  renderer.destroy()
+})
+
+test("mouse scroll reaches scrollbox after terminal shrink", async () => {
+  const { renderer, mockMouse, resize } = await createTestRenderer({
+    width: 160,
+    height: 50,
+  })
+
+  const scrollBox = new ScrollBoxRenderable(renderer, {
+    width: "100%",
+    height: "100%",
+    scrollY: true,
+  })
+  renderer.root.add(scrollBox)
+
+  for (let i = 0; i < 200; i++) {
+    scrollBox.add(
+      new BoxRenderable(renderer, {
+        id: `item-${i}`,
+        height: 2,
+      }),
+    )
+  }
+
+  await renderer.idle()
+
+  // Shrink terminal
+  resize(60, 100)
+  renderer.root.resize(60, 100)
+  await renderer.idle()
+
+  // Scroll to bottom first so we have room to scroll up
+  scrollBox.scrollTop = scrollBox.scrollHeight - 100
+  await renderer.idle()
+  const positionBefore = scrollBox.scrollTop
+
+  // Mouse wheel at row 70 (beyond the old height of 50)
+  await mockMouse.scroll(30, 70, "up")
+  await renderer.idle()
+
+  // scrollTop should have decreased -- the scroll event reached the scrollbox
+  expect(scrollBox.scrollTop).toBeLessThan(positionBefore)
+
+  renderer.destroy()
+})
+
+test("hit grid works after multiple resize cycles", async () => {
+  const { renderer, resize } = await createTestRenderer({
+    width: 80,
+    height: 40,
+  })
+
+  const box = new BoxRenderable(renderer, {
+    id: "target",
+    width: "100%",
+    height: "100%",
+  })
+  renderer.root.add(box)
+  await renderer.idle()
+
+  // Grow: 80x40=3200 -> 120x60=7200
+  resize(120, 60)
+  renderer.root.resize(120, 60)
+  await renderer.idle()
+  expect(renderer.hitTest(5, 55)).not.toBe(0)
+
+  // Shrink back: 120x60=7200 -> 80x40=3200
+  resize(80, 40)
+  renderer.root.resize(80, 40)
+  await renderer.idle()
+  expect(renderer.hitTest(5, 35)).not.toBe(0)
+  // x=100 is outside the new width, should return 0
+  expect(renderer.hitTest(100, 10)).toBe(0)
+
+  // Shrink further: 80x40=3200 -> 40x30=1200
+  resize(40, 30)
+  renderer.root.resize(40, 30)
+  await renderer.idle()
+  expect(renderer.hitTest(5, 25)).not.toBe(0)
+  // Old coordinates should be out of bounds
+  expect(renderer.hitTest(5, 35)).toBe(0)
+  expect(renderer.hitTest(50, 10)).toBe(0)
+
+  renderer.destroy()
+})