refactor(audio): the review's cleanup list, and the design record behind the rack (#3176)

* fix(core): remove the build-audio-fx-runtime.ts stray resurrected by a main merge

An earlier merge with main brought this deleted file back (git's merge/delete
handling on an unchanged-on-one-side file); package.json already points at
build-inline-artifact.ts, so it sat unreachable and duplicating that file's
config, both of which fallow flagged.

* fix(studio): pull TimelineLanes under the 600-line cap

TimelineLanes.tsx hit 620 lines. Extracted the three per-clip pointer
gestures (resize-start, pointer-down move-arm, click/razor-split) into
createClipGestureHandlers — one factory call per rendered clip instead of
~120 lines of inline handler bodies in the render loop. 529 lines now.

* fix(studio): split the extracted pointerdown handler under the CRAP threshold

Moving the ~120-line gesture logic into timelineClipGestureHandlers.ts
concentrated it into two functions fallow flagged (onPointerDown at CRAP
63.6, onResizeStart at 31.6). Split the decision logic (which gesture a
pointerdown implies) into a pure resolvePointerDownAction, then split
its own intent-blocking check into isIntentBlocked. onResizeStart's guard
moved into canStartResize. Every function now scores under 30.

* fix(studio): drop the unused DomEditSelection import in PropertyPanelFlat

CI caught it on PR #3026 (wa-12-panel-params); a later refactor in the
stack removed the last use of the type here without removing the import.

* fix(studio): close the typecheck and fallow gaps wa-18b-reschedule opened

useAutomationLanes.ts's write() assumed gesture-scoped coalescing and a
preview-only commit that useDomEditAttributeCommits.ts never grew — backported
that option support from its own later commit so the two sides of the API
agree. The paste path and its tests were missing the box selection's v0/v1
bounds a sibling commit added to AutomationSelection. The FX panel's carve
controls still edited the six mechanism numbers (maxCutDb, bands,
intelligibilityBias) after carveProfile() collapsed authoring to one Strength
knob, so those fields no longer existed on HfCarveSettings; UI now edits
strength, and analyseCarveBands is called with carveProfile(strength).

Also closes fallow's complexity, dead-code and duplication findings on this
PR's diff: extracted automationLaneDragMath.ts (pure group/point-move math)
and useAutomationRangeDrag.ts (the marquee-select gesture) out of
useAutomationLaneGestures.ts, pulled a couple of render-loop ternaries and a
resolver into named functions, dropped an export nothing outside its file
used, and shared a step-simplifier between audioCarve's two envelope
builders.

The edge-stretch vs. box-select priority test in TimelineAutomationLane.test
was still pinning the pre-box-select rule (edge wins over a point sitting on
it) that a sibling commit deliberately reversed — a point inside the box is
now selected content, so grabbing it drags the group instead. Updated the
test to the shipped rule instead of the old one.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

* fix(core): cap the via conic's weight so an edge-clamped via point can't NaN

A via point pulled out past the segment (viaX: 5, viaY: -3) clamps to
(0.999, 0.001) — exactly on the steady region's edge, where edge - viaX is 0.
viaConic divided by that zero to get an infinite weight, and shapeVia turned
Infinity into NaN a few steps later (Infinity - Infinity in the quadratic
coefficient). NaN reaching setValueCurveAtTime silences the automated
parameter for the rest of the render.

Capped the weight at 1e6 instead of leaving it unbounded — past that point
the arc already reads as touching the via point, so nothing visible is lost.
Also hardened shapeVia's existing denominator guard (`<= 0`) to `!(> 0)`,
since NaN fails the original comparison and fell through it.

Review by Miga (PR #3208).

* fix(studio-server): fingerprint the proactive waveform cache key too

The route already keys the waveform cache on the asset's size and mtime as
well as its path, so a rebuilt-in-place file gets fresh peaks instead of
stale ones. generateWaveformCache — the proactive path that runs on upload —
still called buildWaveformCacheKey with the path alone, so it wrote to a
different key than the route reads from (making the pre-generated cache
never found) and kept the exact collision bug this fingerprint exists to fix
on its own path.

Review by Miga (PR #3211).

* style(docs): run oxfmt on the /hyperframes-audio skill docs

Table column widths had drifted out of alignment with oxfmt's own rules,
failing format:check and blocking the Preflight gate every downstream
branch inherits. Whitespace only, no content change.

* fix(core): stop \b from missing underscore-separated names, guard clipsOverlap's negative duration

\b treats `_` as a word character, so \bbed\b never matched bed_01,
music_bed_loop, or theme_song, and \bvo\b/\bvox\b/\btts\b had the same gap —
an underscore-separated bed classified as "unknown" and could end up offered
as its own carve source. Replaced the short hints with a boundary that
actually excludes letters and digits on both sides.

clipsOverlap computed end = start + duration without guarding sign, so a
negative duration put end before start — an interval that does not describe
anything, and one specific case showed it silently dropping a real overlap
(a shorter, earlier broken end rejected a clip that genuinely contained the
point). Duration clamps to zero instead: a clip cannot un-play time, and a
zero-length clip at its start is the sane reading of "duration nobody wrote
down as positive."

Review by Miga (PR #3212).

* fix(studio): widen PropertyPanel's resetModules render timeout again

The 20s margin (already once widened for the same reason) is timing out in
CI's full-monorepo Test run — the resetModules()+fresh-import render this
test needs is uncached and competes with every other package's test suite
for the same worker pool, and the same test passes in well under 2s
standalone. Went to 45s rather than re-tuning to whatever number happens to
clear the current CI load, since that number moves every time CI gains a
package.

* fix(studio): stop the single-candidate auto-apply carve firing twice

Two auto-apply effects both fire when sourceOptions.length === 1: the
multi-candidate effect only guards length === 0, so a single candidate
passes it too, and the single-candidate effect passes its own guard right
after — both compute the same sources list and both call setCarve, so the
common case (one narrator, one bed) triggered two decodes, two FFT runs, and
two concurrent attribute writes for one decision.

The multi-candidate effect now defers to its sibling for exactly one
candidate, which already has its own detailed handling for that case.

Review by Miga (PR #3213).

* feat(core): carve against every voice over a bed, always (#3212)

* feat(core): carve against every voice over a bed, always dynamically

A bed usually runs under a whole sequence — a narrator, an interview answer, a
second presenter — and carving against one of them left the others fighting it.
`source` becomes `sources`, and `mixCarveSources` sums every voice onto the BED's
clock before anything is measured. That is what keeps one analysis sufficient: the
chain is fixed, so there is no per-voice filter to switch between, and bands drawn
from all the speech there is with envelopes that rise wherever any of it happens
answer the actual question — where and when is speech masking this bed.

Summed rather than averaged: two people talking at once mask more than either
alone. Audio before the bed starts is dropped rather than folded in at zero, since
it plays over nothing and shifting it would put a cut where there is no voice.

`dynamic` is gone. A fixed depth thins the bed through every pause, and once both
have been heard there is no reason to want it, so every carve follows the speech.

Two helpers the panel and the headless script now share instead of each carrying a
copy — two definitions of "what does this name suggest" drift, and then the two
disagree about which track is the voice:

- `classifyAudioName` reads a track's kind from its id and filename together.
  `unknown` is deliberately common: treating an unrecognised name as "not a voice"
  would hide the one track somebody needs to pick.
- `clipsOverlap` keeps out a voice that never plays while the bed does. An unwritten
  duration counts as unbounded, not zero — refusing a clip whose length the
  composition leaves to the media would drop the commonest case there is.

Files written before this still load: a single `source` reads as a one-voice list,
a stored `dynamic` is ignored, and an absent attribute means the defaults whole.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

* fix(core): stop \b from missing underscore-separated names, guard clipsOverlap's negative duration

\b treats `_` as a word character, so \bbed\b never matched bed_01,
music_bed_loop, or theme_song, and \bvo\b/\bvox\b/\btts\b had the same gap —
an underscore-separated bed classified as "unknown" and could end up offered
as its own carve source. Replaced the short hints with a boundary that
actually excludes letters and digits on both sides.

clipsOverlap computed end = start + duration without guarding sign, so a
negative duration put end before start — an interval that does not describe
anything, and one specific case showed it silently dropping a real overlap
(a shorter, earlier broken end rejected a clip that genuinely contained the
point). Duration clamps to zero instead: a clip cannot un-play time, and a
zero-length clip at its start is the sane reading of "duration nobody wrote
down as positive."

Review by Miga (PR #3212).

---------

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>

* fix(studio): port the carve UI off the removed source/dynamic fields

#3212 (accidentally squash-merged into this branch instead of main) changed
HfCarveSettings from a single `source` + `dynamic` toggle to a `sources`
list with dynamic mode removed outright — the multi-voice UI consumer that
goes with that shape lands in the very next PR, so this branch was left with
a type that no longer matched its own code.

Minimal port, not the multi-voice redesign that PR does properly: the
"Listen to" picker and analyse() treat sources[0] as the one voice this UI
still understands, and every dynamic-mode branch (the automated envelope
lanes, the toggle, the checkbox) is gone along with the field — a carve is
now always the static value the analysis computes, matching what the type
change made permanent. Test suite trimmed the same way: the automation-lane
and toggle tests covered behavior that no longer exists.

* docs(plans): fix pre-existing oxfmt formatting drift in audio-fx-presets

Blocks the regression workflow's required preflight gate.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>

Author: vanceingalls

packages/core/src/audio/audioFxGraph.test.ts

@@ -216,6 +216,39 @@ describe("buildFxChain", () => {
     expect(c.created.find((x) => x.kind === "biquad")!.frequency.value).toBe(2000);
   });
 
+  it("lines new values up against the built nodes, skipping a bypassed one", () => {
+    // A bypassed node is not in the graph, so the update has to walk the
+    // ENABLED nodes to stay aligned with what was built. Walking `next.nodes`
+    // instead shifts everything after the bypass by one and pushes each node's
+    // parameters into its neighbour — and the shape is unchanged either way,
+    // so nothing forces a rebuild that would hide it.
+    const c = ctx();
+    const withBypass = (frequency: number): HfAudioFxChain => ({
+      version: 1,
+      nodes: [
+        {
+          type: "highpass",
+          enabled: true,
+          params: { ...defaultAudioFxParams("highpass"), frequency: 100 },
+        },
+        { type: "peaking", enabled: false, params: defaultAudioFxParams("peaking") },
+        {
+          type: "lowpass",
+          enabled: true,
+          params: { ...defaultAudioFxParams("lowpass"), frequency },
+        },
+      ],
+    });
+    const h = buildFxChain(asCtx(c), withBypass(8000));
+    const biquads = c.created.filter((n) => n.kind === "biquad");
+    expect(biquads).toHaveLength(2);
+
+    expect(h.update(withBypass(3000))).toBe(true);
+    // The lowpass took the new cutoff; the highpass was left where it was.
+    expect(biquads[0]!.frequency.value).toBe(100);
+    expect(biquads[1]!.frequency.value).toBe(3000);
+  });
+
   it("reports that a rebuild is needed when the chain shape changes", () => {
     const c = ctx();
     const h = buildFxChain(asCtx(c), chain("peaking"));

packages/core/src/audio/audioFxGraph.ts

@@ -9,6 +9,7 @@
  */
 
 import {
+  enabledAudioFxNodes,
   getAudioFxDef,
   normalizeAudioFxParams,
   type HfAudioFxChain,
@@ -484,8 +485,7 @@ export interface FxChainHandle {
  * into the running nodes; when it changes, the caller rebuilds.
  */
 function shapeOf(chain: HfAudioFxChain): string {
-  return chain.nodes
-    .filter((node) => node.enabled !== false)
+  return enabledAudioFxNodes(chain)
     .map((node) => {
       const p = normalizeAudioFxParams(node.type, node.params);
       const poles = p.poles !== undefined ? `:${p.poles}` : "";
@@ -510,25 +510,23 @@ export function buildFxChain(ctx: BaseAudioContext, chain: HfAudioFxChain): FxCh
   const handles: { id?: string; type: string; handle: FxNodeHandle }[] = [];
 
   let tail: AudioNode = input;
-  for (const node of chain.nodes) {
-    if (node.enabled === false) continue;
+  for (const node of enabledAudioFxNodes(chain)) {
     const handle = buildFxNode(ctx, node.type, node.params ?? {});
     tail.connect(handle.input);
     tail = handle.output;
     handles.push({ ...(node.id ? { id: node.id } : {}), type: node.type, handle });
   }
   tail.connect(output);
 
-  let shape = shapeOf(chain);
+  const shape = shapeOf(chain);
 
   return {
     input,
     output,
     nodes: handles,
     update(next) {
       if (shapeOf(next) !== shape) return false;
-      const active = next.nodes.filter((node) => node.enabled !== false);
-      active.forEach((node, i) => {
+      enabledAudioFxNodes(next).forEach((node, i) => {
         const held = handles[i];
         if (!held) return;
         held.handle.update(normalizeAudioFxParams(node.type, node.params));
@@ -541,7 +539,9 @@ export function buildFxChain(ctx: BaseAudioContext, chain: HfAudioFxChain): FxCh
         if (node.id === undefined) delete held.id;
         else held.id = node.id;
       });
-      shape = shapeOf(next);
+      // `shape` is not reassigned: the early return above already established
+      // that `shapeOf(next)` equals it, so recomputing was a whole normalise +
+      // join per observer tick to write back the string that was already there.
       return true;
     },
     dispose() {

packages/core/src/audioAutomation.test.ts

@@ -3,6 +3,8 @@ import {
   applyCurve,
   shapeProgress,
   fxAutomationTarget,
+  HF_AUDIO_AUTOMATION_ATTR,
+  HF_AUDIO_AUTOMATION_DATA_KEY,
   isConstantLane,
   parseAutomation,
   parseAutomationTarget,
@@ -30,6 +32,14 @@ const lane = (points: HfAutomationLane["points"], target = "volume"): HfAutomati
   points,
 });
 
+describe("the automation attribute's two spellings", () => {
+  it("names the same attribute either way", () => {
+    // Same split as the FX chain: written as an attribute, read as a dataset
+    // key. Derived, so a rename cannot half-land.
+    expect(HF_AUDIO_AUTOMATION_ATTR).toBe(`data-${HF_AUDIO_AUTOMATION_DATA_KEY}`);
+  });
+});
+
 describe("targets", () => {
   it("reads volume and fx targets, and rejects anything else", () => {
     expect(parseAutomationTarget("volume")).toEqual({ kind: "volume" });

packages/core/src/audioAutomation.ts

@@ -11,10 +11,13 @@
  * curve, three consumers, or the picture and the sound disagree.
  */
 
-import { getAudioFxDef, type HfAudioFxChain, type HfAudioFxNumberParam } from "./audioFx.js";
+import { getAudioFxDef, type HfAudioFxChain } from "./audioFx.js";
 
 export const HF_AUDIO_AUTOMATION_ATTR = "data-automation";
 
+/** The same attribute as a `dataset` / `dataAttributes` key. See `HF_AUDIO_FX_DATA_KEY`. */
+export const HF_AUDIO_AUTOMATION_DATA_KEY = HF_AUDIO_AUTOMATION_ATTR.slice("data-".length);
+
 /** Automation files are versioned; a reader must refuse a version it doesn't know. */
 export const HF_AUDIO_AUTOMATION_VERSION = 1;
 
@@ -138,15 +141,14 @@ export function resolveAutomationRange(
   const def = getAudioFxDef(node.type);
   const param = def?.params.find((p) => p.key === parsed.param);
   if (!param || param.kind !== "number") return null;
-  const p = param as HfAudioFxNumberParam;
   return {
-    min: p.min,
-    max: p.max,
-    step: p.step,
-    unit: p.unit,
-    label: `${def?.label ?? node.type} · ${p.label}`,
-    scale: p.scale === "log" && p.min > 0 ? "log" : "linear",
-    default: p.default,
+    min: param.min,
+    max: param.max,
+    step: param.step,
+    unit: param.unit,
+    label: `${def?.label ?? node.type} · ${param.label}`,
+    scale: param.scale === "log" && param.min > 0 ? "log" : "linear",
+    default: param.default,
   };
 }
 

packages/core/src/audioFx.test.ts

@@ -5,7 +5,9 @@ import {
   enabledAudioFxNodes,
   getAudioFxDef,
   HF_AUDIO_FX,
+  HF_AUDIO_FX_ATTR,
   HF_AUDIO_FX_CHAIN_VERSION,
+  HF_AUDIO_FX_DATA_KEY,
   HF_AUDIO_FX_IDS,
   normalizeAudioFxParams,
   parseAudioFxChain,
@@ -47,6 +49,15 @@ describe("effect registry", () => {
   });
 });
 
+describe("the chain attribute's two spellings", () => {
+  it("names the same attribute either way", () => {
+    // The studio WRITES through the attribute and READS through the dataset
+    // key, so the read side used to carry its own `"fx-chain"` literal and a
+    // rename would only half-land. Derived now; this is what keeps it derived.
+    expect(HF_AUDIO_FX_ATTR).toBe(`data-${HF_AUDIO_FX_DATA_KEY}`);
+  });
+});
+
 describe("normalizeAudioFxParams", () => {
   it("fills missing keys with defaults", () => {
     expect(normalizeAudioFxParams("peaking", {})).toEqual(defaultAudioFxParams("peaking"));

packages/core/src/audioFx.ts

@@ -16,6 +16,16 @@
 
 export const HF_AUDIO_FX_ATTR = "data-fx-chain";
 
+/**
+ * The same attribute as a `dataset` / `dataAttributes` key — the `data-` prefix
+ * is not part of that spelling.
+ *
+ * Derived rather than restated: the studio writes through
+ * `HF_AUDIO_FX_ATTR` and reads through the key, so a hardcoded `"fx-chain"`
+ * on the read side is a rename waiting to half-land.
+ */
+export const HF_AUDIO_FX_DATA_KEY = HF_AUDIO_FX_ATTR.slice("data-".length);
+
 /** Chain files are versioned; a reader must refuse a version it doesn't know. */
 export const HF_AUDIO_FX_CHAIN_VERSION = 1;
 

packages/studio/src/components/editor/audioFxSummary.ts

@@ -7,11 +7,11 @@
  * grouping exists to prevent — that they are seven things to manage.
  */
 
-import { parseAudioFxChain } from "@hyperframes/core/audio-fx";
+import { HF_AUDIO_FX_DATA_KEY, parseAudioFxChain } from "@hyperframes/core/audio-fx";
 import type { DomEditSelection } from "./domEditingTypes";
 
 export function audioFxSummary(element: DomEditSelection): string {
-  const raw = element.dataAttributes?.["fx-chain"];
+  const raw = element.dataAttributes?.[HF_AUDIO_FX_DATA_KEY];
   const carveAttr = element.dataAttributes?.["fx-carve"];
   let handBuilt = 0;
   let carveNodes = 0;

packages/studio/src/components/editor/propertyPanelAudioFxGroup.tsx

@@ -11,6 +11,7 @@ import { useEffect, useState } from "react";
 import {
   defaultAudioFxParams,
   HF_AUDIO_FX_ATTR,
+  HF_AUDIO_FX_DATA_KEY,
   mintAudioFxNodeId,
   parseAudioFxChain,
   serializeAudioFxChain,
@@ -41,6 +42,7 @@ import {
   automatedTargetsOf,
   automationAttrValue,
   HF_AUDIO_AUTOMATION_ATTR,
+  HF_AUDIO_AUTOMATION_DATA_KEY,
   readPanelAutomation,
   resolveAutomationRange,
   withoutLane,
@@ -109,7 +111,7 @@ export function AudioFxGroup({
   onSetAttributeLive: (attr: string, value: string | null) => void | Promise<void>;
 }) {
   const chain = ((): HfAudioFxChain => {
-    const raw = element.dataAttributes?.["fx-chain"];
+    const raw = element.dataAttributes?.[HF_AUDIO_FX_DATA_KEY];
     if (!raw) return { version: 1, nodes: [] };
     try {
       return parseAudioFxChain(raw);
@@ -120,7 +122,10 @@ export function AudioFxGroup({
     }
   })();
 
-  const automation = readPanelAutomation(element.dataAttributes?.["automation"], chain);
+  const automation = readPanelAutomation(
+    element.dataAttributes?.[HF_AUDIO_AUTOMATION_DATA_KEY],
+    chain,
+  );
   const automatedTargets = automatedTargetsOf(automation);
 
   /**
@@ -485,11 +490,24 @@ export function AudioFxGroup({
   const analyse = async (active: HfCarveSettings | null = carve): Promise<void> => {
     if (!active?.sources.length) return;
     const doc = element.element?.ownerDocument;
+    if (!doc) return;
     // Every named voice that is actually there with something to decode. A source
     // naming a deleted track is skipped rather than failing the whole analysis.
-    const voices = active.sources
-      .map((id) => doc?.getElementById(id) as HTMLAudioElement | null)
-      .filter((el): el is HTMLAudioElement => Boolean(el?.getAttribute("src")));
+    //
+    // Read out to plain values here rather than carrying elements around: it is
+    // what lets the src and the start be non-null by construction downstream
+    // instead of by assertion.
+    const voices: { src: string; start: string | null }[] = [];
+    for (const id of active.sources) {
+      const el = doc.getElementById(id);
+      // By tag name, not `instanceof HTMLAudioElement`: these elements belong to
+      // the composition's iframe document, so the constructor they were made
+      // from is not this realm's and the instanceof is false for every one.
+      if (el?.tagName !== "AUDIO") continue;
+      const src = el.getAttribute("src");
+      if (!src) continue;
+      voices.push({ src, start: el.getAttribute("data-start") });
+    }
     if (voices.length === 0) return;
     setAnalysing(true);
     try {
@@ -502,7 +520,7 @@ export function AudioFxGroup({
           .webkitOfflineAudioContext;
       if (!Ctor) return;
       const decode = async (relative: string): Promise<AudioBuffer> => {
-        const res = await fetch(new URL(relative, doc!.baseURI).href);
+        const res = await fetch(new URL(relative, doc.baseURI).href);
         return new Ctor(1, 1, DECODE_SAMPLE_RATE).decodeAudioData(await res.arrayBuffer());
       };
       const bedStart = clipStart(element.dataAttributes?.["start"]);
@@ -512,9 +530,9 @@ export function AudioFxGroup({
       // is also what lets the bands and the envelopes stay a single set: the chain is
       // fixed, so there is no per-voice filter to switch between.
       const decoded = await Promise.all(
-        voices.map(async (el) => ({
-          samples: (await decode(el.getAttribute("src")!)).getChannelData(0),
-          offsetSeconds: clipStart(el.getAttribute("data-start")) - bedStart,
+        voices.map(async (voice) => ({
+          samples: (await decode(voice.src)).getChannelData(0),
+          offsetSeconds: clipStart(voice.start) - bedStart,
         })),
       );
       const voiceMix = mixCarveSources(decoded, DECODE_SAMPLE_RATE);

packages/studio/src/components/editor/propertyPanelAutomation.ts

@@ -8,6 +8,7 @@
 
 import {
   HF_AUDIO_AUTOMATION_ATTR,
+  HF_AUDIO_AUTOMATION_DATA_KEY,
   parseAutomation,
   resolveAutomation,
   resolveAutomationRange,
@@ -77,4 +78,4 @@ export function automationAttrValue(automation: HfAutomation): string {
   return automation.lanes.length > 0 ? serializeAutomation(automation) : "";
 }
 
-export { HF_AUDIO_AUTOMATION_ATTR, resolveAutomationRange };
+export { HF_AUDIO_AUTOMATION_ATTR, HF_AUDIO_AUTOMATION_DATA_KEY, resolveAutomationRange };

packages/studio/src/components/editor/propertyPanelFxSection.test.tsx

@@ -165,6 +165,55 @@ describe("FxSection chain", () => {
     expect(next.nodes.map((n) => n.type)).toEqual(["reverb", "peaking"]);
   });
 
+  it("keeps a half-typed value with its own effect across a reorder", () => {
+    // Rows used to be keyed `${type}-${index}`, so two effects of the same type
+    // kept their keys through a reorder and React reused each row where it
+    // stood. The controls hold real state — a number field mid-edit is held as
+    // text — so the buffer stayed at the position and landed on whichever
+    // effect moved into it.
+    const peaking = (id: string, frequency: number) => ({
+      type: "peaking",
+      id,
+      enabled: true,
+      params: { ...defaultAudioFxParams("peaking"), frequency },
+    });
+    const a = peaking("pa", 400);
+    const b = peaking("pb", 1600);
+    const chainOfNodes = (...nodes: unknown[]): HfAudioFxChain =>
+      ({ version: 1, nodes }) as HfAudioFxChain;
+
+    const host = document.createElement("div");
+    document.body.append(host);
+    const root = createRoot(host);
+    const render = (chain: HfAudioFxChain) =>
+      act(() => {
+        root.render(
+          <FxSection
+            chain={chain}
+            onChainChange={vi.fn()}
+            onChainPreview={vi.fn()}
+            carve={null}
+            onCarveChange={vi.fn()}
+            sourceOptions={[]}
+          />,
+        );
+      });
+
+    render(chainOfNodes(a, b));
+    // Only the first card is open, which is the one being edited.
+    const openFrequency = (): HTMLInputElement =>
+      host.querySelector<HTMLInputElement>(".hf-fx-node .hf-fx-number")!;
+
+    expect(openFrequency().value).toBe("400");
+    typeInto(openFrequency(), "123");
+    expect(openFrequency().value).toBe("123");
+
+    // The author moves that effect down; the other one takes the open slot.
+    render(chainOfNodes(b, a));
+
+    expect(openFrequency().value).toBe("1600");
+  });
+
   it("cannot move the ends past themselves", () => {
     const { host } = mount({ chain: chainOf("peaking", "reverb") });
     const ups = host.querySelectorAll('.hf-fx-move[title="Move up"]');