@assistant-ui/react 0.15.24 → 0.15.26

package/src/unstable/useComposerInput.ts

@@ -12,6 +12,7 @@ import {
   useTriggerPopoverAriaProps,
 } from "../primitives/composer/useComposerInputState";
 
+/** @deprecated Experimental since 2026-06-23. Not scheduled for removal; the API may change in any release. */
 export type Unstable_UseComposerInputOptions = {
   /**
    * Disables the input in addition to the composer's own disabled sources
@@ -21,6 +22,7 @@ export type Unstable_UseComposerInputOptions = {
   disabled?: boolean | undefined;
 };
 
+/** @deprecated Experimental since 2026-06-23. Not scheduled for removal; the API may change in any release. */
 export type Unstable_ComposerInput = {
   /** Current composer text, or `""` when the composer is not editing. */
   value: string;
@@ -49,8 +51,6 @@ export type Unstable_ComposerInput = {
 };
 
 /**
- * @deprecated Under active development and might change without notice.
- *
  * Headless bridge to the composer's text value and send action, for building a
  * custom composer input without `ComposerPrimitive.Input`. It is a thin bridge,
  * not a second input: it does not own keyboard behavior, autosize, IME or
@@ -58,6 +58,8 @@ export type Unstable_ComposerInput = {
  * state. Spread `unstable_useTriggerPopoverAriaProps()` onto your element for
  * trigger-popover combobox semantics.
  *
+ * @deprecated Experimental since 2026-06-23. Not scheduled for removal; the API may change in any release.
+ *
  * @example
  * ```tsx
  * const { value, setText, send, isDisabled, canSend } = unstable_useComposerInput();
@@ -104,17 +106,18 @@ export function unstable_useComposerInput(
   return { value, setText, send, isDisabled, canSend };
 }
 
+/** @deprecated Experimental since 2026-06-23. Not scheduled for removal; the API may change in any release. */
 export type Unstable_TriggerPopoverAriaProps = TriggerPopoverAriaProps;
 
 /**
- * @deprecated Under active development and might change without notice.
- *
  * ARIA combobox attributes for the focused element (typically the composer
  * input) describing the open trigger popover, per the WAI-ARIA editable
  * combobox pattern. Returns an empty object outside a `TriggerPopoverRoot` or
  * when no popover is open. Spread these last so they take precedence over any
  * matching ARIA props you set yourself, mirroring `ComposerPrimitive.Input`.
  *
+ * @deprecated Experimental since 2026-06-23. Not scheduled for removal; the API may change in any release.
+ *
  * @example
  * ```tsx
  * const aria = unstable_useTriggerPopoverAriaProps();

package/src/unstable/useComposerInputHistory.ts

@@ -14,6 +14,7 @@ import type { ThreadMessage } from "@assistant-ui/core";
 import { getThreadMessageText } from "@assistant-ui/core/internal";
 import { useTriggerPopoverRootContextOptional } from "../primitives/composer/trigger/TriggerPopoverRootContext";
 
+/** @deprecated Experimental since 2026-06-11. Not scheduled for removal; the API may change in any release. */
 export type Unstable_ComposerInputHistory = {
   /** Keydown handler to spread onto `ComposerPrimitive.Input`. */
   onKeyDown: KeyboardEventHandler<HTMLTextAreaElement>;
@@ -45,8 +46,6 @@ const isOnLastLine = (value: string, caret: number): boolean =>
   !value.slice(caret).includes("\n");
 
 /**
- * @deprecated Under active development and might change without notice.
- *
  * Terminal-style input history for the thread composer: ArrowUp on an
  * empty draft recalls previously sent user messages (newest first),
  * ArrowDown steps back toward the newest and finally restores the draft
@@ -58,6 +57,8 @@ const isOnLastLine = (value: string, caret: number): boolean =>
  * to modifier keys, and to consumer handlers that already called
  * `preventDefault`. It is inert on edit composers.
  *
+ * @deprecated Experimental since 2026-06-11. Not scheduled for removal; the API may change in any release.
+ *
  * @example
  * ```tsx
  * const history = unstable_useComposerInputHistory();

package/src/unstable/useLiveCompletionAdapter.ts

@@ -1,18 +1,13 @@
 "use client";
 
-import {
-  useCallback,
-  useEffect,
-  useLayoutEffect,
-  useMemo,
-  useRef,
-  useState,
-} from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useIsomorphicLayoutEffect } from "../utils/useIsomorphicLayoutEffect";
 import type {
   Unstable_TriggerAdapter,
   Unstable_TriggerItem,
 } from "@assistant-ui/core";
 
+/** @deprecated Experimental since 2026-06-15. Not scheduled for removal; the API may change in any release. */
 export type Unstable_UseLiveCompletionAdapterOptions = {
   /**
    * Fetches the items for a query from an async source. Called debounced; the
@@ -35,8 +30,6 @@ export type Unstable_UseLiveCompletionAdapterOptions = {
 const NO_QUERY = "\u0000";
 
 /**
- * @deprecated Under active development and may change without notice.
- *
  * Bridges an async completion source (a server search, a gateway RPC) into the
  * synchronous `Unstable_TriggerAdapter` that `ComposerTriggerPopover` consumes.
  * `search(query)` returns the last fetched items synchronously and schedules a
@@ -47,6 +40,8 @@ const NO_QUERY = "\u0000";
  * `isLoading` is `true` while a fetch is in flight. Pass it to the popover's
  * `isLoading` prop to render a loading state.
  *
+ * @deprecated Experimental since 2026-06-15. Not scheduled for removal; the API may change in any release.
+ *
  * @example
  * ```tsx
  * const mentions = unstable_useLiveCompletionAdapter({
@@ -75,7 +70,7 @@ export function unstable_useLiveCompletionAdapter(
 
   const fetcherRef = useRef(fetcher);
   // The debounce timer must only observe fetchers from committed renders.
-  useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     fetcherRef.current = fetcher;
   }, [fetcher]);
 
@@ -143,7 +138,7 @@ export function unstable_useLiveCompletionAdapter(
   );
 
   const scheduleFetchRef = useRef(scheduleFetch);
-  useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     scheduleFetchRef.current = scheduleFetch;
   }, [scheduleFetch]);
 
@@ -156,7 +151,7 @@ export function unstable_useLiveCompletionAdapter(
   }, [cancelTimer, rearmPendingRetry]);
 
   const cacheKeyRef = useRef(cacheKey);
-  useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     if (cacheKeyRef.current === cacheKey) return;
     cacheKeyRef.current = cacheKey;
     invalidatePending();
@@ -175,7 +170,7 @@ export function unstable_useLiveCompletionAdapter(
 
   // Render-time searches can outlive an abandoned render, so they only arm
   // request work after this hook commits.
-  useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     inactiveRef.current = false;
     const deferredQuery = deferredQueryRef.current;
     deferredQueryRef.current = null;

package/src/unstable/useMentionAdapter.ts

@@ -17,9 +17,14 @@ import {
   type ModelContextSnapshotSource,
 } from "./useModelContextSnapshot";
 
-/** Icon component shape consumed by `ComposerTriggerPopover`'s `iconMap`. */
+/**
+ * Icon component shape consumed by `ComposerTriggerPopover`'s `iconMap`.
+ *
+ * @deprecated Experimental since 2026-04-15. Not scheduled for removal; the API may change in any release.
+ */
 export type Unstable_IconComponent = FC<{ className?: string }>;
 
+/** @deprecated Experimental since 2026-04-15. Not scheduled for removal; the API may change in any release. */
 export type Unstable_Mention = {
   readonly id: string;
   readonly type: string;
@@ -30,12 +35,14 @@ export type Unstable_Mention = {
   readonly metadata?: ReadonlyJSONObject | undefined;
 };
 
+/** @deprecated Experimental since 2026-03-16. Not scheduled for removal; the API may change in any release. */
 export type Unstable_MentionCategory = {
   readonly id: string;
   readonly label: string;
   readonly items: readonly Unstable_Mention[];
 };
 
+/** @deprecated Experimental since 2026-04-15. Not scheduled for removal; the API may change in any release. */
 export type Unstable_ModelContextToolsOptions = {
   /**
    * Wrap tools in a dedicated category. Selects drill-down mode on its own
@@ -48,6 +55,7 @@ export type Unstable_ModelContextToolsOptions = {
   readonly icon?: string;
 };
 
+/** @deprecated Experimental since 2026-04-15. Not scheduled for removal; the API may change in any release. */
 export type Unstable_UseMentionAdapterOptions = {
   /**
    * Flat mention list. Ignored when `categories` is set, and keeps the
@@ -78,6 +86,7 @@ export type Unstable_UseMentionAdapterOptions = {
   readonly fallbackIcon?: Unstable_IconComponent;
 };
 
+/** @deprecated Experimental since 2026-04-15. Not scheduled for removal; the API may change in any release. */
 export type Unstable_MentionDirective = {
   readonly formatter: Unstable_DirectiveFormatter;
   readonly onInserted?: ((item: Unstable_TriggerItem) => void) | undefined;
@@ -120,12 +129,12 @@ const toolMentionSource: ModelContextSnapshotSource<
 };
 
 /**
- * @deprecated Under active development and might change without notice.
- *
  * Creates a spreadable `{ adapter, directive }` bundle for `@` mentions.
  * Supports tools registered in model context, explicit items, or both —
  * flat or categorized.
  *
+ * @deprecated Experimental since 2026-04-15. Not scheduled for removal; the API may change in any release.
+ *
  * @example
  * ```tsx
  * const mention = unstable_useMentionAdapter();

package/src/unstable/useMessageStallDetection.test.tsx

@@ -0,0 +1,40 @@
+// @vitest-environment jsdom
+
+import { renderToString } from "react-dom/server";
+import { afterEach, describe, expect, it, vi } from "vitest";
+
+const { message } = vi.hoisted(() => ({
+  message: {
+    status: { type: "running" as const },
+    content: [{ type: "text" as const, text: "streaming" }],
+  },
+}));
+
+vi.mock("@assistant-ui/store", async (importOriginal) => ({
+  ...(await importOriginal<typeof import("@assistant-ui/store")>()),
+  useAuiState: (selector: (state: { message: typeof message }) => unknown) =>
+    selector({ message }),
+}));
+
+vi.mock("@assistant-ui/store/internal", async (importOriginal) => ({
+  ...(await importOriginal<typeof import("@assistant-ui/store/internal")>()),
+  useShallowSelector: <T,>(selector: T) => selector,
+}));
+
+import { unstable_useMessageStallDetection } from "./useMessageStallDetection";
+
+describe("unstable_useMessageStallDetection", () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("does not read the wall clock during server render", () => {
+    const nowSpy = vi.spyOn(Date, "now");
+    const Probe = () => (
+      <span>{String(unstable_useMessageStallDetection().stalled)}</span>
+    );
+
+    expect(renderToString(<Probe />)).toBe("<span>false</span>");
+    expect(nowSpy).not.toHaveBeenCalled();
+  });
+});

package/src/unstable/useMessageStallDetection.ts

@@ -4,6 +4,7 @@ import { useEffect, useRef, useState } from "react";
 import { useAuiState } from "@assistant-ui/store";
 import { useShallowSelector } from "@assistant-ui/store/internal";
 
+/** @deprecated Experimental since 2026-06-13. Not scheduled for removal; the API may change in any release. */
 export type Unstable_MessageStallDetectionOptions = {
   /**
    * Milliseconds of unchanged message content before the message counts as
@@ -13,6 +14,7 @@ export type Unstable_MessageStallDetectionOptions = {
   thresholdMs?: number | undefined;
 };
 
+/** @deprecated Experimental since 2026-06-13. Not scheduled for removal; the API may change in any release. */
 export type Unstable_MessageStallDetection = {
   /** True while the message is running and its content has not changed for at least `thresholdMs`. */
   stalled: boolean;
@@ -21,8 +23,6 @@ export type Unstable_MessageStallDetection = {
 };
 
 /**
- * @deprecated Under active development and might change without notice.
- *
  * Detects mid-run output stalls on the current message: while the message is
  * running, watches its text, reasoning, and tool-argument values plus tool-result
  * availability and reports a stall once they stop changing for `thresholdMs`.
@@ -30,6 +30,8 @@ export type Unstable_MessageStallDetection = {
  * provider stalls, after the first tokens have already streamed.
  *
  * Must be used inside a message scope.
+ *
+ * @deprecated Experimental since 2026-06-13. Not scheduled for removal; the API may change in any release.
  */
 export function unstable_useMessageStallDetection(
   options?: Unstable_MessageStallDetectionOptions,
@@ -57,9 +59,9 @@ export function unstable_useMessageStallDetection(
   );
 
   const running = activity[0] === true;
-  const lastActivityRef = useRef(Date.now());
+  const lastActivityRef = useRef(0);
   const [stalled, setStalled] = useState(false);
-  const [, setTick] = useState(0);
+  const [now, setNow] = useState(0);
 
   useEffect(() => {
     if (!running) return undefined;
@@ -73,26 +75,30 @@ export function unstable_useMessageStallDetection(
       return undefined;
     }
 
+    const stall = () => {
+      setNow(Date.now());
+      setStalled(true);
+    };
     const sinceActivity = Date.now() - lastActivityRef.current;
     if (sinceActivity >= thresholdMs) {
-      setStalled(true);
+      stall();
       return undefined;
     }
 
     setStalled(false);
-    const id = setTimeout(() => setStalled(true), thresholdMs - sinceActivity);
+    const id = setTimeout(stall, thresholdMs - sinceActivity);
     return () => clearTimeout(id);
   }, [running, activity, thresholdMs]);
 
   useEffect(() => {
     if (!stalled) return undefined;
-    const id = setInterval(() => setTick((t) => t + 1), 1000);
+    const id = setInterval(() => setNow(Date.now()), 1000);
     return () => clearInterval(id);
   }, [stalled]);
 
   if (!stalled) return { stalled: false, stalledForMs: 0 };
   return {
     stalled: true,
-    stalledForMs: Math.max(0, Date.now() - lastActivityRef.current),
+    stalledForMs: Math.max(0, now - lastActivityRef.current),
   };
 }

package/src/unstable/useSlashCommandAdapter.ts

@@ -1,6 +1,7 @@
 "use client";
 
-import { useLayoutEffect, useMemo, useRef } from "react";
+import { useMemo, useRef } from "react";
+import { useIsomorphicLayoutEffect } from "../utils/useIsomorphicLayoutEffect";
 import type {
   Unstable_TriggerAdapter,
   Unstable_TriggerItem,
@@ -8,6 +9,7 @@ import type {
 import type { Unstable_IconComponent } from "./useMentionAdapter";
 import { matchesTriggerItemQuery } from "../primitives/composer/trigger/matchesTriggerItemQuery";
 
+/** @deprecated Experimental since 2026-04-15. Not scheduled for removal; the API may change in any release. */
 export type Unstable_SlashCommand = {
   readonly id: string;
   readonly label?: string | undefined;
@@ -16,6 +18,7 @@ export type Unstable_SlashCommand = {
   readonly execute: () => void;
 };
 
+/** @deprecated Experimental since 2026-04-06. Not scheduled for removal; the API may change in any release. */
 export type Unstable_UseSlashCommandAdapterOptions = {
   readonly commands: readonly Unstable_SlashCommand[];
   /** Strip the trigger text from the composer after executing. @default false */
@@ -26,19 +29,20 @@ export type Unstable_UseSlashCommandAdapterOptions = {
   readonly fallbackIcon?: Unstable_IconComponent;
 };
 
+/** @deprecated Experimental since 2026-04-15. Not scheduled for removal; the API may change in any release. */
 export type Unstable_SlashCommandAction = {
   readonly onExecute: (item: Unstable_TriggerItem) => void;
   readonly removeOnExecute?: boolean | undefined;
 };
 
 /**
- * @deprecated Under active development and may change without notice.
- *
  * Bundles slash command definitions (with inline `execute` callbacks) into
  * `{adapter, action}` that plug directly into `ComposerTriggerPopover`.
  * `execute` stays in the hook closure and is never attached to the returned
  * `TriggerItem`, keeping items serializable.
  *
+ * @deprecated Experimental since 2026-04-06. Not scheduled for removal; the API may change in any release.
+ *
  * @example
  * ```tsx
  * const slash = unstable_useSlashCommandAdapter({
@@ -71,7 +75,7 @@ export function unstable_useSlashCommandAdapter(
     : nextItems;
 
   // The adapter's callbacks must only observe commands from committed renders.
-  useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     commandsRef.current = commands;
     committedItemsRef.current = items;
   }, [commands, items]);

package/src/unstable/webmcp/useWebMcpProvider.ts

@@ -20,10 +20,12 @@ import {
   type ModelContextSnapshotSource,
 } from "../useModelContextSnapshot";
 
+/** @deprecated Experimental since 2026-08-29. Not scheduled for removal; the API may change in any release. */
 export type Unstable_WebMcpProviderOptions = {
   filter?: (name: string, tool: Tool<any, any>) => boolean;
 };
 
+/** @deprecated Experimental since 2026-08-29. Not scheduled for removal; the API may change in any release. */
 export type Unstable_WebMcpProviderResult = {
   status: "unsupported" | "active";
   registeredToolNames: readonly string[];
@@ -128,6 +130,8 @@ const useWebMcpRegistry = ({
  * Returns `status: "unsupported"` when the page exposes no
  * `document.modelContext` (or `navigator.modelContext`), and the sorted names
  * of the tools currently registered with the host.
+ *
+ * @deprecated Experimental since 2026-08-29. Not scheduled for removal; the API may change in any release.
  */
 export const unstable_useWebMcpProvider = (
   options: Unstable_WebMcpProviderOptions = {},

package/src/utils/getSelectionMessageId.test.ts

@@ -30,6 +30,237 @@ afterEach(() => {
 });
 
 describe("getSelectionMessageId", () => {
+  it.each([false, true])(
+    "accepts an end at the next message's first text offset zero (backward: %s)",
+    (backward) => {
+      document.body.innerHTML =
+        '<div data-message-id="message-1"><p id="first" data-aui-quote-selectable>first text</p></div><div data-message-id="message-2"><p data-aui-quote-selectable><span id="second">second text</span></p></div>';
+      const first = textNode("#first");
+      const second = textNode("#second");
+      const selection = selectText(first);
+      if (backward) {
+        selection.setBaseAndExtent(second, 0, first, 1);
+      } else {
+        selection.setBaseAndExtent(first, 1, second, 0);
+      }
+      const endpoints = [
+        selection.anchorNode,
+        selection.anchorOffset,
+        selection.focusNode,
+        selection.focusOffset,
+      ];
+      const text = selection.toString();
+
+      expect(getSelectionMessageId(selection)).toBe("message-1");
+      expect(selection.toString()).toBe(text);
+      expect([
+        selection.anchorNode,
+        selection.anchorOffset,
+        selection.focusNode,
+        selection.focusOffset,
+      ]).toEqual(endpoints);
+    },
+  );
+
+  it("accepts an end at the next message element's offset zero", () => {
+    document.body.innerHTML =
+      '<div data-message-id="message-1"><p id="first" data-aui-quote-selectable>first text</p></div><div id="second" data-message-id="message-2"><p>second text</p></div>';
+    const selection = selectText(textNode("#first"));
+    const second = document.querySelector("#second");
+    assert(second);
+    selection.getRangeAt(0).setEnd(second, 0);
+
+    expect(getSelectionMessageId(selection)).toBe("message-1");
+  });
+
+  it.each([false, true])(
+    "accepts a zero-offset end inside an excluded next message (backward: %s)",
+    (backward) => {
+      document.body.innerHTML =
+        '<div data-message-id="message-1"><p id="first" data-aui-quote-selectable>first text</p></div><div data-message-id="message-2" data-aui-quote-selectable="false"><p><span id="second">second text</span></p></div>';
+      const first = textNode("#first");
+      const second = textNode("#second");
+      const selection = selectText(first);
+      selection.setBaseAndExtent(
+        backward ? second : first,
+        0,
+        backward ? first : second,
+        0,
+      );
+      const endpoints = [
+        selection.anchorNode,
+        selection.anchorOffset,
+        selection.focusNode,
+        selection.focusOffset,
+      ];
+      const text = selection.toString();
+
+      expect(getSelectionMessageId(selection)).toBe("message-1");
+      expect(selection.toString()).toBe(text);
+      expect([
+        selection.anchorNode,
+        selection.anchorOffset,
+        selection.focusNode,
+        selection.focusOffset,
+      ]).toEqual(endpoints);
+    },
+  );
+
+  it.each(["<span></span>", "<span> </span>", "<span>excluded text</span>"])(
+    "rejects selected content inheriting the next message's exclusion: %s",
+    (prefix) => {
+      document.body.innerHTML = `<div data-message-id="message-1"><p id="first" data-aui-quote-selectable>first text</p></div><div data-message-id="message-2" data-aui-quote-selectable="false">${prefix}<p id="second">second text</p></div>`;
+      const first = textNode("#first");
+      const second = textNode("#second");
+      const selection = selectText(first);
+      for (const backward of [false, true]) {
+        selection.setBaseAndExtent(
+          backward ? second : first,
+          0,
+          backward ? first : second,
+          0,
+        );
+        expect(getSelectionMessageId(selection)).toBeNull();
+      }
+    },
+  );
+
+  it.each([
+    { footer: "", separator: "", prefix: "<span></span>" },
+    { footer: "", separator: "\n  ", prefix: "" },
+    {
+      footer: '<div class="footer"><button><svg></svg></button></div>',
+      separator: "",
+      prefix: "",
+    },
+    {
+      footer: "<div><span></span></div>",
+      separator: "\n",
+      prefix: "<span></span>\n",
+    },
+  ])(
+    "skips empty chrome and whitespace at the end: %j",
+    ({ footer, separator, prefix }) => {
+      document.body.innerHTML = `<div data-message-id="message-1"><p id="first" data-aui-quote-selectable>first text</p>${footer}</div>${separator}<div data-message-id="message-2">${prefix}<p id="second">second text</p></div>`;
+      const first = textNode("#first");
+      const second = textNode("#second");
+      const selection = selectText(first);
+      for (const backward of [false, true]) {
+        selection.setBaseAndExtent(
+          backward ? second : first,
+          backward ? 0 : 1,
+          backward ? first : second,
+          backward ? 1 : 0,
+        );
+        const endpoints = [
+          selection.anchorNode,
+          selection.anchorOffset,
+          selection.focusNode,
+          selection.focusOffset,
+        ];
+        const text = selection.toString();
+        expect(getSelectionMessageId(selection)).toBe("message-1");
+        expect(selection.toString()).toBe(text);
+        expect([
+          selection.anchorNode,
+          selection.anchorOffset,
+          selection.focusNode,
+          selection.focusOffset,
+        ]).toEqual(endpoints);
+      }
+    },
+  );
+
+  it.each([
+    { footer: "<footer>footer text</footer>", prefix: "" },
+    { footer: "", prefix: "<header>next message header</header>" },
+    {
+      footer: '<div data-aui-quote-selectable="false"><span></span>\n</div>',
+      prefix: "",
+    },
+    {
+      footer: "",
+      prefix: '<div data-aui-quote-selectable="false"><span></span>\n</div>',
+    },
+  ])(
+    "does not trim selected content or exclusions: %j",
+    ({ footer, prefix }) => {
+      document.body.innerHTML = `<div data-message-id="message-1"><p id="first" data-aui-quote-selectable>first text</p>${footer}</div>\n<div data-message-id="message-2">${prefix}<p id="second">second text</p></div>`;
+      const selection = selectText(textNode("#first"));
+      selection.getRangeAt(0).setEnd(textNode("#second"), 0);
+      expect(getSelectionMessageId(selection)).toBeNull();
+    },
+  );
+
+  it("does not normalize past the selection start", () => {
+    document.body.innerHTML =
+      '<div data-message-id="message-1"><p id="first">first text</p><span></span></div><div data-message-id="message-2"><p id="second">second text</p></div>';
+    const first = textNode("#first");
+    const selection = selectText(first);
+    selection.setBaseAndExtent(first, first.length, textNode("#second"), 0);
+    expect(getSelectionMessageId(selection)).toBeNull();
+  });
+
+  it.each(["<span>\n </span>", "<span></span>"])(
+    "preserves inherited exclusions after a nested opt-in: %s",
+    (suffix) => {
+      document.body.innerHTML = `<div data-message-id="message-1"><div data-aui-quote-selectable="false"><p id="first" data-aui-quote-selectable>first text</p>${suffix}</div></div><div data-message-id="message-2"><p id="second">second text</p></div>`;
+      const first = textNode("#first");
+      const second = textNode("#second");
+      const selection = selectText(first);
+      expect(getSelectionMessageId(selection)).toBe("message-1");
+      for (const backward of [false, true]) {
+        selection.setBaseAndExtent(
+          backward ? second : first,
+          0,
+          backward ? first : second,
+          0,
+        );
+        expect(getSelectionMessageId(selection)).toBeNull();
+      }
+    },
+  );
+
+  it("rejects even one selected character in the next message", () => {
+    document.body.innerHTML =
+      '<div data-message-id="message-1"><p id="first">first text</p></div><div data-message-id="message-2"><p id="second">second text</p></div>';
+    const selection = selectText(textNode("#first"));
+    selection.getRangeAt(0).setEnd(textNode("#second"), 1);
+
+    expect(getSelectionMessageId(selection)).toBeNull();
+  });
+
+  it.each(["", '<span aria-hidden="true"></span>'])(
+    "rejects an empty excluded subtree before a zero-offset end with suffix %s",
+    (suffix) => {
+      document.body.innerHTML = `<div data-message-id="message-1" data-aui-quote-selectable><p id="first">first text</p><span data-aui-quote-selectable="false"></span>${suffix}</div><div data-message-id="message-2"><p id="second">second text</p></div>`;
+      const selection = selectText(textNode("#first"));
+      selection.getRangeAt(0).setEnd(textNode("#second"), 0);
+
+      expect(getSelectionMessageId(selection)).toBeNull();
+    },
+  );
+
+  it("rejects an excluded subtree preceding the next message's text", () => {
+    document.body.innerHTML =
+      '<div data-message-id="message-1"><p id="first">first text</p></div><div data-message-id="message-2"><span data-aui-quote-selectable="false"></span><p id="second">second text</p></div>';
+    const selection = selectText(textNode("#first"));
+    selection.getRangeAt(0).setEnd(textNode("#second"), 0);
+
+    expect(getSelectionMessageId(selection)).toBeNull();
+  });
+
+  it("still checks thread ownership after adjusting a zero-offset end", () => {
+    document.body.innerHTML =
+      '<div id="first-thread"><div data-message-id="message-1"><p id="first">first text</p></div><div data-message-id="message-2"><p id="second">second text</p></div></div><div id="second-thread"></div>';
+    const selection = selectText(textNode("#first"));
+    selection.getRangeAt(0).setEnd(textNode("#second"), 0);
+    const root = document.querySelector("#second-thread");
+    assert(root);
+
+    expect(getSelectionMessageId(selection, root)).toBeNull();
+  });
+
   it("rejects a message outside the supplied thread root", () => {
     document.body.innerHTML = `
       <div id="first-thread">