diff --git a/packages/junior-dashboard/e2e/settings.spec.ts b/packages/junior-dashboard/e2e/settings.spec.ts index de0f6272be..fe8d4e8b76 100644 --- a/packages/junior-dashboard/e2e/settings.spec.ts +++ b/packages/junior-dashboard/e2e/settings.spec.ts @@ -47,3 +47,23 @@ test("follows the system theme until the user picks one", async ({ await page.emulateMedia({ colorScheme: "dark" }); await expect(root).toHaveAttribute("data-theme", "dark"); }); + +test("turns on composer autocorrect for this browser", async ({ + page, + dashboard, +}) => { + await page.goto(dashboard.baseURL); + const composer = page.getByPlaceholder("Message Junior…"); + await expect(composer).toHaveAttribute("autocorrect", "off"); + await expect(composer).toHaveAttribute("autocapitalize", "off"); + await expect(composer).toHaveAttribute("spellcheck", "false"); + + await page.getByRole("button", { name: /Open profile menu/ }).click(); + await page.getByRole("link", { name: "Settings", exact: true }).click(); + await page.getByText("Autocorrect", { exact: true }).click(); + + await page.goto(dashboard.baseURL); + await expect(composer).toHaveAttribute("autocorrect", "on"); + await expect(composer).toHaveAttribute("autocapitalize", "sentences"); + await expect(composer).toHaveAttribute("spellcheck", "true"); +}); diff --git a/packages/junior-dashboard/src/client/conversations/ConversationComposer.tsx b/packages/junior-dashboard/src/client/conversations/ConversationComposer.tsx index 0e3f4025c2..588dcaaeeb 100644 --- a/packages/junior-dashboard/src/client/conversations/ConversationComposer.tsx +++ b/packages/junior-dashboard/src/client/conversations/ConversationComposer.tsx @@ -26,6 +26,7 @@ import { } from "../components/ui/tooltip"; import { useDashboardOnline } from "../connection"; import { cn, dashboardComposerSurfaceClass } from "../styles"; +import { useComposerAutocorrect } from "./composerAutocorrect"; const DRAFT_STORAGE_PREFIX = "junior:dashboard:conversation-draft:"; // Keep keystrokes off the storage path. Mobile Safari pays for every write. @@ -132,6 +133,7 @@ export const ConversationComposer = memo(function ConversationComposer( const [dragging, setDragging] = useState(false); const fileInputRef = useRef(null); const online = useDashboardOnline(); + const [autocorrect] = useComposerAutocorrect(); const id = useId(); const textareaRef = useRef(null); const draftRef = useRef(initialDraft); @@ -490,10 +492,11 @@ export const ConversationComposer = memo(function ConversationComposer(