diff --git a/src/components/Toolbar.customerCopy.test.tsx b/src/components/Toolbar.customerCopy.test.tsx new file mode 100644 index 000000000..4639cc857 --- /dev/null +++ b/src/components/Toolbar.customerCopy.test.tsx @@ -0,0 +1,34 @@ +import { afterEach, describe, expect, it } from 'vitest'; +import { cleanup, render, screen } from '@testing-library/react'; +import { Editor } from '@tiptap/react'; +import { Toolbar } from './Toolbar.js'; +import { buildExtensions } from '../extensions/kit.js'; + +let editor: Editor | undefined; + +afterEach(() => { + cleanup(); + if (editor && !editor.isDestroyed) editor.destroy(); + editor = undefined; +}); + +describe('Toolbar customer-facing copy', () => { + it('keeps implementation jargon out of the image action accessible name', () => { + const element = document.createElement('div'); + document.body.appendChild(element); + editor = new Editor({ + element, + extensions: buildExtensions({ image: { maxDimension: 0 } }), + content: '

hello

', + }); + + render(); + + expect( + screen.getByRole('button', { name: 'Insert inline image' }), + ).toBeInTheDocument(); + expect( + screen.queryByRole('button', { name: /base64/i }), + ).not.toBeInTheDocument(); + }); +}); diff --git a/src/components/Toolbar.test.tsx b/src/components/Toolbar.test.tsx index aeaf6895f..8300110a8 100644 --- a/src/components/Toolbar.test.tsx +++ b/src/components/Toolbar.test.tsx @@ -112,7 +112,7 @@ describe('Toolbar', () => { const italic = screen.getByRole('button', { name: /Italic/ }); const insertTable = screen.getByRole('button', { name: /^Insert table$/ }); const insertImage = screen.getByRole('button', { - name: /Insert inline \(base64\) image/, + name: /Insert inline image/, }); const enabledButtons = ( screen.getAllByRole('button') as HTMLButtonElement[] @@ -149,7 +149,7 @@ describe('Toolbar', () => { const bold = screen.getByRole('button', { name: /Bold/ }); const insertImage = screen.getByRole('button', { - name: /Insert inline \(base64\) image/, + name: /Insert inline image/, }); fireEvent.focus(insertImage); expect(insertImage).toHaveAttribute('tabindex', '0'); diff --git a/src/components/Toolbar.tsx b/src/components/Toolbar.tsx index 55136e550..08e7b12bb 100644 --- a/src/components/Toolbar.tsx +++ b/src/components/Toolbar.tsx @@ -368,7 +368,7 @@ export function Toolbar({ editor, image, onImageError }: ToolbarProps) { onClick={() => editor.chain().focus().deleteTable().run()} /> fileInputRef.current?.click()} />