@bycrux/editor 1.1.0 → 1.2.1

package/src/text/__tests__/FontPicker.baseUrl.test.tsx

@@ -0,0 +1,112 @@
+import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'
+import { render, cleanup } from '@testing-library/react'
+import { FontFamilyPicker, FONT_OPTIONS, setFontsBaseUrl } from '../FontPicker'
+
+// FontFamilyPicker's own `ensureGoogleFontsLoaded` is private to FontPicker.tsx
+// (unrelated to, and independent from, `lib/google-fonts.ts`'s loader of the
+// same name — see that file's header comment). It has no exported entry point,
+// so we drive it the way the app does: mount the component, whose first-mount
+// useEffect calls it.
+function mountPicker() {
+  return render(<FontFamilyPicker value="" onChange={() => {}} />)
+}
+
+function injectedHrefs(): string[] {
+  return Array.from(document.head.querySelectorAll('link[rel="stylesheet"]')).map(
+    (l) => (l as HTMLLinkElement).href,
+  )
+}
+
+/** Every Google family the picker previews, as the labels a vendored family
+ *  list would spell. Derived from FONT_OPTIONS rather than hardcoded, so
+ *  adding a family to the picker cannot leave this test asserting a stale set. */
+const PICKER_FAMILIES = FONT_OPTIONS.filter((f) => f.isGoogleFont).map((f) => f.label)
+
+beforeEach(() => {
+  document.head.querySelectorAll('link[rel="stylesheet"]').forEach((l) => l.remove())
+  vi.spyOn(console, 'info').mockImplementation(() => {})
+  vi.spyOn(console, 'warn').mockImplementation(() => {})
+})
+
+afterEach(() => {
+  cleanup()
+  setFontsBaseUrl(undefined)
+  vi.restoreAllMocks()
+})
+
+describe('FontFamilyPicker google fonts base URL', () => {
+  // Must run before any other test in this file sets a base: the injection
+  // guard is keyed on the computed URL, and the default URL can only be
+  // observed as "not yet injected" once per module lifetime.
+  it('unset produces exactly the default per-family googleapis URL (byte-identical to pre-base behaviour)', () => {
+    mountPicker()
+    const hrefs = injectedHrefs()
+    expect(hrefs).toEqual([
+      'https://fonts.googleapis.com/css2?family=Inter:wght@400;700&family=Roboto:wght@400;700&family=Open+Sans:wght@400;700&family=Lato:wght@400;700&family=Montserrat:wght@400;700&family=Poppins:wght@400;700&family=Raleway:wght@400;700&family=Nunito:wght@400;700&family=Work+Sans:wght@400;700&family=DM+Sans:wght@400;700&family=Rubik:wght@400;700&family=Oswald:wght@400;700&family=Bebas+Neue:wght@400;700&family=Playfair+Display:wght@400;700&family=Merriweather:wght@400;700&family=Source+Serif+4:wght@400;700&family=JetBrains+Mono:wght@400;700&family=Baloo+2:wght@400;500;600;700;800&family=Fredoka:wght@300;400;500;600;700&family=Sniglet:wght@400;800&display=swap',
+    ])
+  })
+
+  it('a base whose family list covers the picker produces <base>/fonts.css ONLY — zero egress', () => {
+    setFontsBaseUrl('https://example.com/fonts/editor', PICKER_FAMILIES)
+    mountPicker()
+    expect(injectedHrefs()).toEqual(['https://example.com/fonts/editor/fonts.css'])
+  })
+
+  it('setting a base after a prior injection still injects — a stale guard must not suppress it', () => {
+    // Bases unique to this test so it doesn't depend on injection history left
+    // by the tests above (module state, not DOM state, outlives a test — the
+    // beforeEach above only clears document.head).
+    setFontsBaseUrl('https://example.com/fonts/one', PICKER_FAMILIES)
+    mountPicker()
+    expect(injectedHrefs()).toEqual(['https://example.com/fonts/one/fonts.css'])
+
+    setFontsBaseUrl('https://example.com/fonts/two', PICKER_FAMILIES)
+    mountPicker()
+    const hrefs = injectedHrefs()
+    expect(hrefs).toHaveLength(2)
+    expect(hrefs).toContain('https://example.com/fonts/two/fonts.css')
+  })
+
+  // The picker's families ARE the vendored set's reason for existing, so in a
+  // correctly configured app this never fires. It is guarded because the day a
+  // family is added to FONT_OPTIONS and not yet vendored, the alternative is a
+  // picker preview silently showing a system fallback — the exact rot a
+  // declared family list exists to catch.
+  it('a family the vendored list omits falls through to Google, alongside the vendored sheet', () => {
+    const warn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+    const partial = PICKER_FAMILIES.filter((f) => f !== 'Sniglet')
+    setFontsBaseUrl('https://example.com/fonts/partial', partial)
+    mountPicker()
+
+    const hrefs = injectedHrefs()
+    expect(hrefs).toHaveLength(2)
+    expect(hrefs[0]).toBe('https://example.com/fonts/partial/fonts.css')
+    expect(hrefs[1]).toBe('https://fonts.googleapis.com/css2?family=Sniglet:wght@400;800&display=swap')
+    expect(warn.mock.calls[0][0]).toContain('Sniglet')
+  })
+
+  it('a base with no family list links nothing vendored and emits exactly the default googleapis URL', async () => {
+    // A fresh module instance, because the URL this produces IS the default
+    // URL — every picker family falls through — and the module-level dedupe
+    // would (correctly) suppress it after the first test above already
+    // injected it. Asserting against the live module would therefore pass
+    // vacuously, on an empty list.
+    vi.resetModules()
+    const fresh = await import('../FontPicker')
+    const warn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+
+    fresh.setFontsBaseUrl('https://example.com/fonts/nolist')
+    render(<fresh.FontFamilyPicker value="" onChange={() => {}} />)
+
+    const hrefs = injectedHrefs()
+    expect(hrefs).toHaveLength(1)
+    expect(hrefs[0]).toContain('fonts.googleapis.com')
+    expect(hrefs[0]).not.toContain('fonts.css')
+    // Every picker family is in it — nothing was withheld on the strength of
+    // a base we were given no family list for.
+    for (const label of PICKER_FAMILIES) expect(hrefs[0]).toContain(`family=${label.replace(/ /g, '+')}`)
+    expect(warn.mock.calls[0][0]).toContain('treating NOTHING as vendored')
+
+    fresh.setFontsBaseUrl(undefined)
+  })
+})

package/src/video/VersionPanel.tsx

@@ -111,7 +111,7 @@ export default function VersionPanel({ versions, restoring, onRestore, onSaveVer
         <button
           onClick={handleSaveClick}
           disabled={saving || !onSaveVersion}
-          className="shrink-0 flex items-center gap-1.5 h-8 px-3 rounded-md bg-[var(--editor-accent)] text-white text-xs font-medium hover:opacity-90 transition-opacity disabled:opacity-40 disabled:hover:opacity-40"
+          className="shrink-0 flex items-center gap-1.5 h-8 px-3 rounded-md bg-[var(--editor-accent)] text-[var(--editor-accent-foreground)] text-xs font-medium hover:opacity-90 transition-opacity disabled:opacity-40 disabled:hover:opacity-40"
         >
           <Save size={13} />
           {saving ? 'Saving…' : 'Save version'}

package/src/video/VideoEditor.tsx

@@ -11,10 +11,12 @@ import { getOverlayDesignCanvas } from './design-canvas'
 import { availableResolutionTiers, availableFpsTiers, currentResolutionTier, maxExportFps } from './export-limits'
 import { applyTheme, defaultMontajTheme, isLightTheme } from '../theme'
 import { collapseGaps, rippleDelete, splitAtTime } from './cuts'
+import { addMarker } from './timeline/markers'
 import { repairCaptionWords } from './captionRepair'
 import { maxCaptionLane, normalizeCaptionLanes } from './captionLanes'
 import Timeline, { type TimelineActions, type TimelineMode } from './timeline/Timeline'
-import { computeAutoCrossfade, computeDerivedTiming, computeVisualCrossfade, enabledTrackItems, mapTrackItems, normalizeAudioTracks, trackItems } from './timeline/timeline-model'
+import { visualDuration } from '@bycrux/timeline-core'
+import { audioEnd, computeAutoCrossfade, computeDerivedTiming, computeVisualCrossfade, enabledTrackItems, mapTrackItems, normalizeAudioTracks, trackItems, withEnabledItemTracks } from './timeline/timeline-model'
 import { makeCaptionEdit, type CaptionEditPatch } from './timeline/makeCaptionEdit'
 import PreviewPlayer, { type TransportHandle, type ScrubHandle } from './preview/PreviewPlayer'
 import SocialPreviewMenu, { PlatformGlyph, platformOption } from './preview/SocialPreviewMenu'
@@ -144,6 +146,56 @@ export function backfillCaptionIds<P extends Project>(project: P): P {
   }
 }
 
+/**
+ * Where a marker lands.
+ *
+ * With the preview axis ON, the yellow line is what the operator is looking at,
+ * so that is where the marker goes; with it OFF — or ON but with the pointer
+ * off the timeline, where `hoverScrub` reads null — the playhead is.
+ *
+ * `??`, never `||`: a hovered 0 is the start of the timeline, a perfectly
+ * ordinary place to mark, and `||` would silently reroute it to the playhead.
+ *
+ * Exported and tested on its own because `hoverScrub` is a private ref with no
+ * test seam. `handleSplit` carries the same rule inline
+ * (`previewAxis ? (hoverScrub.get() ?? undefined) : undefined`) and is
+ * deliberately NOT refactored onto this helper here: that is existing,
+ * currently-untested behavior and changing it is outside this plan. If you
+ * touch Split's rule later, unify it with this one.
+ */
+export function markerDropTime(previewAxis: boolean, hovered: number | null, playhead: number): number {
+  return previewAxis ? (hovered ?? playhead) : playhead
+}
+
+/**
+ * How long the export dialog thinks the finished video is.
+ *
+ * This is what bounds the cover-frame picker, so it has to be the duration the
+ * RENDER produces — hence `visualDuration`, timeline-core's port of render.js's
+ * own `getTotalDurationSeconds`: the furthest `end` over every item on every
+ * track, audio excluded. Anything narrower offers the operator a grid that
+ * stops before their video does.
+ *
+ * It used to be `max(end)` over the track-0 VIDEO items alone (the same list
+ * that feeds `keeps`). That reads track 0 as "the footage track", which is only
+ * true when there IS footage: an overlay-only project — one track of nothing
+ * but overlays, which the animations workflow emits routinely — measured 0, so
+ * the picker reported "No frames to pick from" for a project made entirely of
+ * pickable frames. The milder version of the same bug cut the grid short
+ * whenever an outro overlay outlived the last clip.
+ *
+ * `keeps` is deliberately NOT widened to match. It answers a different
+ * question — which windows contain real footage the SDR curve thumbnails can
+ * sample — and an overlay-only project genuinely has none.
+ *
+ * Enabled tracks only, and via `withEnabledItemTracks` because `visualDuration`
+ * wants the flat array-of-arrays shape: a track the operator has switched off
+ * is skipped by the render too, so it must not stretch the picker.
+ */
+export function exportDurationSec(project: { tracks?: unknown }): number {
+  return visualDuration(withEnabledItemTracks(project))
+}
+
 /**
  * `<VideoEditor>` — the assembled, host-agnostic video editor.
  *
@@ -1178,7 +1230,10 @@ function ReviewSurface<P extends Project>({
     keeps: renderKeeps,
     imageTone: { value: currentImageTone ?? 'vivid', set: handleImageToneChange },
     name: project.name?.trim() || undefined,
-    durationSec: renderKeeps.reduce((m, k) => Math.max(m, k.end), 0),
+    // NOT derived from `renderKeeps` — see `exportDurationSec`. Keeps covers
+    // the footage windows the curve thumbnails can sample; the cover picker
+    // has to span the whole rendered video, overlay-only projects included.
+    durationSec: exportDurationSec(project),
     aspectRatio: (() => {
       const r = project.settings?.resolution
       return r && r[0] > 0 && r[1] > 0 ? r[0] / r[1] : undefined
@@ -1194,7 +1249,13 @@ function ReviewSurface<P extends Project>({
       set: handleExportFpsChange,
     },
   }), [
-    isHdrProject, renderKeeps, currentImageTone, handleImageToneChange,
+    // `project.tracks` is listed for `exportDurationSec`, which reads every
+    // track rather than just the footage keeps. `renderKeeps` already changes
+    // identity with it, so this is belt-and-braces — but relying on that would
+    // leave the duration silently stale the day keeps stops being memoized on
+    // tracks. Deliberately NOT the whole `project`: this memo is kept off
+    // unrelated project mutations on purpose (see `availableRes` above).
+    isHdrProject, renderKeeps, project.tracks, currentImageTone, handleImageToneChange,
     project.name, project.settings?.resolution, project.settings?.fps,
     availableRes, availableFpsList, handleExportResolutionChange, handleExportFpsChange,
   ])
@@ -1246,7 +1307,25 @@ function ReviewSurface<P extends Project>({
   }, [project.id, project.captions])
 
   const clips      = trackItems(project)[0] ?? []
-  const hasContent = clips.length > 0 || (trackItems(project).slice(1).flat().length ?? 0) > 0 || (project.captions?.segments?.length ?? 0) > 0
+  // Gates the ENTIRE preview region — transport, click-to-play surface and the
+  // multi-track audio elements all live inside it, so anything this misses is
+  // not merely invisible, it is unplayable with no UI saying why.
+  //
+  // Audio counts. An audio-only timeline is the normal state of an animations
+  // project between wiring music and authoring the first overlay, and gating
+  // the region out there left the operator a populated timeline, a drawn
+  // waveform lane, and no transport to press: space did nothing at all.
+  //
+  // `trackItems` is deliberately NOT sliced to `[1:]`. Track 0 is a content
+  // track in a canvas project — an animations-workflow project is frequently
+  // ONE track holding nothing but overlays — and `clips` only counts track-0
+  // *video* items, so a track-0 overlay fell through both terms. Same blind
+  // spot `transportEndFor` and `canvasMaxEndRef` were fixed for.
+  const hasContent =
+    clips.length > 0
+    || trackItems(project).flat().length > 0
+    || (project.captions?.segments?.length ?? 0) > 0
+    || audioEnd(project) > 0
 
   // Preview controls row's timecode readout. `currentTime` is the same
   // `usePlaybackTime(clock)` subscription `CaptionListPanelWithClock` uses
@@ -1621,6 +1700,13 @@ function ReviewSurface<P extends Project>({
     void sync.mutate(() => updated as P)
   }
 
+  function handleAddMarker(at?: number) {
+    const base = syncProjectRef.current
+    const updated = addMarker(base, at ?? clock.get())
+    if (updated === base) return   // key repeat inside the half-frame window
+    void sync.mutate(() => updated as P)
+  }
+
   function handleRippleToggle() {
     const next = !rippleMode
     setRippleMode(next)
@@ -1757,6 +1843,13 @@ function ReviewSurface<P extends Project>({
       // is selected (a no-op if the axis isn't over the item).
       action: () => handleSplit(previewAxis ? (hoverScrub.get() ?? undefined) : undefined),
     },
+    {
+      id: 'video.add-marker',
+      description: 'Drop a marker',
+      keyHint: ['M'],
+      matches: matchesPlainKey('m'),
+      action: () => handleAddMarker(markerDropTime(previewAxis, hoverScrub.get(), clock.get())),
+    },
     {
       id: 'video.undo',
       description: 'Undo',
@@ -1897,6 +1990,7 @@ function ReviewSurface<P extends Project>({
   const paletteCommands: PaletteCommand[] = [
     { id: 'play-pause', label: 'Play/Pause', keyHint: ['Space'], run: () => transportRef.current?.togglePlay() },
     { id: 'split', label: 'Split at playhead', keyHint: ['S'], run: () => handleSplit() },
+    { id: 'add-marker', label: 'Drop a marker', keyHint: ['M'], run: () => handleAddMarker() },
   ]
   if (primarySelectedId) {
     paletteCommands.push({ id: 'ripple-delete', label: 'Ripple-delete selection', keyHint: ['⇧', 'Delete'], run: () => handleRippleDelete() })

package/src/video/__tests__/VideoEditor.keymap.test.tsx

@@ -386,6 +386,70 @@ describe('VideoEditor — preview axis toggle', () => {
   })
 })
 
+describe('VideoEditor — M drops a marker', () => {
+  it('drops one at the playhead with an auto-number label', async () => {
+    const adapter = makeFakeAdapter()
+    const onProjectChange = vi.fn()
+    render(<VideoEditor project={makeVideoProject()} adapter={adapter} onProjectChange={onProjectChange} slots={{ exportActions: <div /> }} />)
+    await screen.findByLabelText('Preview axis')
+
+    await act(async () => {
+      document.dispatchEvent(new KeyboardEvent('keydown', { key: 'm' }))
+    })
+    const next = onProjectChange.mock.calls[onProjectChange.mock.calls.length - 1][0]
+    expect(next.markers).toHaveLength(1)
+    expect(next.markers[0]).toMatchObject({ t: 0, label: '1' })   // playhead starts at 0
+  })
+
+  it('does not fire while typing in a text surface', async () => {
+    const adapter = makeFakeAdapter()
+    const onProjectChange = vi.fn()
+    render(<VideoEditor project={makeVideoProject()} adapter={adapter} onProjectChange={onProjectChange} slots={{ exportActions: <div /> }} />)
+    await screen.findByLabelText('Preview axis')
+    onProjectChange.mockClear()   // drop the mount-time "notify host" call — see the Space test above
+
+    const input = document.createElement('input')
+    document.body.appendChild(input)
+    await act(async () => {
+      input.dispatchEvent(new KeyboardEvent('keydown', { key: 'm', bubbles: true }))
+    })
+    expect(onProjectChange).not.toHaveBeenCalled()
+    input.remove()
+  })
+
+  it('Cmd+M is left alone — the shortcut is the bare letter', async () => {
+    // Cmd+M minimises the window on macOS; swallowing it would be hostile.
+    const adapter = makeFakeAdapter()
+    const onProjectChange = vi.fn()
+    render(<VideoEditor project={makeVideoProject()} adapter={adapter} onProjectChange={onProjectChange} slots={{ exportActions: <div /> }} />)
+    await screen.findByLabelText('Preview axis')
+    onProjectChange.mockClear()   // drop the mount-time "notify host" call — see the Space test above
+
+    await act(async () => {
+      document.dispatchEvent(new KeyboardEvent('keydown', { key: 'm', metaKey: true }))
+    })
+    expect(onProjectChange).not.toHaveBeenCalled()
+  })
+
+  it('holding M does not spray markers', async () => {
+    // Key repeat fires keydown over and over at the same playhead; the
+    // half-frame guard in addMarker must make every repeat after the first a
+    // no-op that never reaches onProjectChange.
+    const adapter = makeFakeAdapter()
+    const onProjectChange = vi.fn()
+    render(<VideoEditor project={makeVideoProject()} adapter={adapter} onProjectChange={onProjectChange} slots={{ exportActions: <div /> }} />)
+    await screen.findByLabelText('Preview axis')
+
+    for (let i = 0; i < 5; i++) {
+      await act(async () => {
+        document.dispatchEvent(new KeyboardEvent('keydown', { key: 'm' }))
+      })
+    }
+    const last = onProjectChange.mock.calls[onProjectChange.mock.calls.length - 1][0]
+    expect(last.markers).toHaveLength(1)
+  })
+})
+
 // ── T2 — copy / paste / duplicate / paste-attributes ────────────────────
 //
 // Persistence assertions read `adapter.saveProject`'s SECOND argument (the

package/src/video/__tests__/cuts.test.ts

@@ -310,6 +310,90 @@ describe('splitAtTime', () => {
     expect(lw.duration + rw.duration).toBeCloseTo(10)
   })
 
+  // A fade belongs to an EDGE. Both halves used to inherit BOTH fades from the
+  // spread, so every cut manufactured a fade-out into the razor and a fade-in
+  // out of it — on a voiceover with the usual trailing fade, each cut left a
+  // fragment ramping to silence at the cut that the operator had to zero by
+  // hand.
+  it('does not manufacture a fade-out at the cut on the left half', () => {
+    const p = makeProject({
+      tracks: vtracks([]),
+      audio: { tracks: [{ id: 'au', src: 'a.mp3', start: 0, end: 100, fadeOut: 0.4 }] },
+    })
+    const [left, right] = splitAtTime(p, 40, null).audio!.tracks
+    expect(left.fadeOut).toBeUndefined()   // the cut edge — no fade was asked for
+    expect(right.fadeOut).toBe(0.4)        // still the original END, keeps its fade
+  })
+
+  it('does not manufacture a fade-in at the cut on the right half', () => {
+    const p = makeProject({
+      tracks: vtracks([]),
+      audio: { tracks: [{ id: 'au', src: 'a.mp3', start: 0, end: 100, fadeIn: 0.3 }] },
+    })
+    const [left, right] = splitAtTime(p, 40, null).audio!.tracks
+    expect(left.fadeIn).toBe(0.3)          // still the original START, keeps its fade
+    expect(right.fadeIn).toBeUndefined()   // the cut edge
+  })
+
+  it('drops the curve along with the fade it described', () => {
+    // A `fadeOutCurve` on a half with no fade-out is dead data, and the next
+    // hand-drawn fade there should start from the default shape.
+    const p = makeProject({
+      tracks: vtracks([]),
+      audio: { tracks: [{
+        id: 'au', src: 'a.mp3', start: 0, end: 100,
+        fadeIn: 0.3, fadeInCurve: 'linear', fadeOut: 0.4, fadeOutCurve: 'log',
+      }] },
+    })
+    const [left, right] = splitAtTime(p, 40, null).audio!.tracks
+    expect(left.fadeInCurve).toBe('linear')
+    expect(left.fadeOutCurve).toBeUndefined()
+    expect(right.fadeOutCurve).toBe('log')
+    expect(right.fadeInCurve).toBeUndefined()
+  })
+
+  it('splitting twice never reintroduces a fade at either cut', () => {
+    // The shape that surfaced this: successive razors down one voiceover. The
+    // middle fragment owns neither original edge, so it must carry no fade at
+    // all — before the fix it carried both.
+    const p = makeProject({
+      tracks: vtracks([]),
+      audio: { tracks: [{ id: 'au', src: 'a.mp3', start: 0, end: 100, fadeIn: 0.3, fadeOut: 0.4 }] },
+    })
+    const once = splitAtTime(p, 40, null)
+    const twice = splitAtTime(once, 70, once.audio!.tracks[1].id)
+    const [a, b, c] = twice.audio!.tracks
+    expect([a.fadeIn, a.fadeOut]).toEqual([0.3, undefined])
+    expect([b.fadeIn, b.fadeOut]).toEqual([undefined, undefined])
+    expect([c.fadeIn, c.fadeOut]).toEqual([undefined, 0.4])
+  })
+
+  it('clamps a kept fade that no longer fits its own fragment', () => {
+    // A 3s fade-out is fine on the whole 20s track; the fragment it lands on is
+    // 1s long. Nothing downstream re-clamps — the renderer just anchors
+    // `st = end - fadeOut`, which would start the fade before this fragment's
+    // audio begins.
+    const p = makeProject({
+      tracks: vtracks([]),
+      audio: { tracks: [{ id: 'au', src: 'a.mp3', start: 0, end: 20, fadeIn: 3, fadeOut: 3 }] },
+    })
+    const [left, right] = splitAtTime(p, 19, null).audio!.tracks
+    expect(right.fadeOut).toBe(1)   // clamped to the 1s fragment
+    expect(left.fadeIn).toBe(3)     // still fits the 19s fragment, untouched
+  })
+
+  it('leaves a track with no fades alone', () => {
+    const p = makeProject({
+      tracks: vtracks([]),
+      audio: { tracks: [{ id: 'au', src: 'a.mp3', start: 0, end: 10 }] },
+    })
+    const [left, right] = splitAtTime(p, 4, null).audio!.tracks
+    for (const half of [left, right]) {
+      expect(half).not.toHaveProperty('fadeIn')
+      expect(half).not.toHaveProperty('fadeOut')
+    }
+  })
+
   it('carries an existing trim window across a split (both halves stay within source)', () => {
     // A pre-trimmed track: source window [2,12] mapped onto timeline [0,10].
     const p = makeProject({

package/src/video/__tests__/exportDurationSec.test.ts

@@ -0,0 +1,60 @@
+/**
+ * The export dialog's duration — what the cover-frame picker samples across.
+ *
+ * This used to be derived from the track-0 VIDEO items alone, which is a safe
+ * reading only when track 0 holds footage. An overlay-only project (the
+ * animations workflow emits exactly that: one track of nothing but overlays)
+ * therefore reported 0, and the picker had no frames to offer — on a project
+ * that renders perfectly well and is entirely made of pickable frames.
+ */
+import { describe, it, expect } from 'vitest'
+import { exportDurationSec } from '../VideoEditor'
+import type { EditorProject, VisualItem } from '../../schema'
+
+const video = (id: string, start: number, end: number): VisualItem =>
+  ({ id, type: 'video', src: `/${id}.mp4`, start, end }) as VisualItem
+const overlay = (id: string, start: number, end: number): VisualItem =>
+  ({ id, type: 'overlay', src: `/${id}.jsx`, start, end }) as VisualItem
+
+function proj(tracks: { items: VisualItem[]; enabled?: boolean }[]): EditorProject {
+  return {
+    id: 'p', status: 'draft', settings: { resolution: [1920, 1080], fps: 30 },
+    tracks: tracks.map((t, i) => ({ id: `trk-${i}`, ...t })),
+  } as EditorProject
+}
+
+describe('exportDurationSec', () => {
+  it('spans an overlay-only project, which used to report 0', () => {
+    // The Daubert-demo shape: one track, overlays only, no video anywhere.
+    expect(exportDurationSec(proj([{ items: [overlay('o1', 0, 5), overlay('o2', 5, 12)] }]))).toBe(12)
+  })
+
+  it('reaches an overlay that outlives the last video clip', () => {
+    // An outro card after the final clip is ordinary, and its frames are just
+    // as pickable as the footage before it — the render encodes to 14, so the
+    // picker has to offer the whole 14.
+    expect(exportDurationSec(proj([
+      { items: [video('v', 0, 8)] },
+      { items: [overlay('outro', 8, 14)] },
+    ]))).toBe(14)
+  })
+
+  it('still matches the video end when video is the longest thing', () => {
+    // The common case must not move.
+    expect(exportDurationSec(proj([
+      { items: [video('a', 0, 4), video('b', 4, 9)] },
+      { items: [overlay('o', 0, 3)] },
+    ]))).toBe(9)
+  })
+
+  it('ignores a disabled track, which the render also skips', () => {
+    expect(exportDurationSec(proj([
+      { items: [video('v', 0, 6)] },
+      { items: [overlay('o', 0, 30)], enabled: false },
+    ]))).toBe(6)
+  })
+
+  it('is 0 for a project with nothing on any track', () => {
+    expect(exportDurationSec(proj([{ items: [] }]))).toBe(0)
+  })
+})

package/src/video/__tests__/markerDropTime.test.ts

@@ -0,0 +1,25 @@
+import { describe, it, expect } from 'vitest'
+import { markerDropTime } from '../VideoEditor'
+
+describe('markerDropTime', () => {
+  it('uses the playhead when the preview axis is off', () => {
+    expect(markerDropTime(false, 12, 4)).toBe(4)
+  })
+
+  it('uses the hovered time when the axis is on', () => {
+    // The yellow line is what the operator is looking at, so that is where the
+    // marker goes.
+    expect(markerDropTime(true, 12, 4)).toBe(12)
+  })
+
+  it('falls back to the playhead when the axis is on but nothing is hovered', () => {
+    // Axis on with the pointer off the timeline: hoverScrub reads null.
+    expect(markerDropTime(true, null, 4)).toBe(4)
+  })
+
+  it('treats a hovered 0 as a real position, not as absent', () => {
+    // The bug a `||` instead of `??` would introduce: the very start of the
+    // timeline is a perfectly ordinary place to mark.
+    expect(markerDropTime(true, 0, 4)).toBe(0)
+  })
+})

package/src/video/cuts.ts

@@ -481,19 +481,47 @@ function splitAudioTrack(track: AudioTrack, at: number): [AudioTrack, AudioTrack
   const outPoint = track.outPoint ?? track.sourceDuration ?? (track.end - track.start)
   const splitPoint = inPoint + (at - track.start)
 
+  // A FADE BELONGS TO AN EDGE, NOT TO THE CLIP. Spreading `...track` into both
+  // halves gave both fragments both fades, which is wrong on the two edges the
+  // split just created: the left half fades OUT into the cut and the right half
+  // fades IN out of it, neither of which anyone asked for. On a voiceover
+  // carrying the usual trailing fade-out that is very visible — every cut
+  // produced a fragment that ramps to silence at the razor, and the operator
+  // has to zero it by hand each time. Fades are added deliberately; a cut is
+  // not a request for one.
+  //
+  // So each half keeps only the fade whose EDGE it still owns:
+  //   • the left half keeps the original START, so it keeps `fadeIn`;
+  //   • the right half keeps the original END, so it keeps `fadeOut`;
+  //   • the two new edges at the cut carry no fade at all.
+  // The paired curve goes with its fade — a `fadeOutCurve` describing a
+  // fade-out that no longer exists is dead data, and the operator's next
+  // hand-drawn fade should start from the default shape like any other new one.
+  //
+  // The kept fade is then clamped to its own fragment's span. A 3s fade-out on
+  // a 20s track is fine; split that track 1s from its end and the 3s fade no
+  // longer fits inside the 1s fragment it lands on. Nothing downstream
+  // re-clamps for us — the pointer-machine and the properties panel each clamp
+  // their OWN edits, and the renderer just anchors `st = end - fadeOut`, which
+  // for an oversized fade starts before the fragment's audio does.
+  const { fadeOut: _outAmt, fadeOutCurve: _outCurve, ...leftBase } = track
+  const { fadeIn: _inAmt, fadeInCurve: _inCurve, ...rightBase } = track
+
   const left: AudioTrack = {
-    ...track,
+    ...leftBase,
     end: at,
     inPoint,
     outPoint: splitPoint,
   }
   const right: AudioTrack = {
-    ...track,
+    ...rightBase,
     id: uniqueId(track.id),
     start: at,
     inPoint: splitPoint,
     outPoint,
   }
+  if (left.fadeIn !== undefined)  left.fadeIn  = Math.min(left.fadeIn, at - track.start)
+  if (right.fadeOut !== undefined) right.fadeOut = Math.min(right.fadeOut, track.end - at)
   return [left, right]
 }