feat: image cropping / resizing T0

web/src/views/__tests__/EditorImageUpload.spec.ts

@@ -10,6 +10,15 @@ import RootComponent from '@/App.vue'
 
 const FIXED_NOW = '2026-09-26T11:02:00Z'
 
+vi.mock('@/lib/imageCrop', async (importOriginal) => {
+	const actual = await importOriginal<typeof import('@/lib/imageCrop')>()
+	return {
+		...actual,
+		readNaturalImageSize: vi.fn(async () => ({ width: 4032, height: 3024 })),
+		renderCroppedImage: vi.fn(async () => new Blob([new Uint8Array(430080)])),
+	}
+})
+
 class FakeXMLHttpRequest {
 	static instances: FakeXMLHttpRequest[] = []
 
@@ -195,8 +204,8 @@ describe("Opening the uploader from the toolbar's image button shows the idle st
 	})
 })
 
-describe('Dropping a valid file onto the editor opens the uploader already uploading it', () => {
-	it('opens uploading, not idle, and sends the file', async () => {
+describe('Dropping a valid file onto the editor opens the uploader already showing the crop step', () => {
+	it('opens the crop step, and confirming it sends the resized file', async () => {
 		const wrapper = await mountEditor({
 			'GET /v1/article/12': () => mockResponse(200, articleFixture()),
 		})
@@ -209,8 +218,12 @@ describe('Dropping a valid file onto the editor opens the uploader already uploa
 		wrapper.findComponent(ArticleEditor).element.dispatchEvent(dropEvent)
 		await flushPromises()
 
-		expect(document.body.textContent).toContain('Add an image')
+		expect(document.body.textContent).toContain('Crop and resize')
 		expect(document.body.textContent).not.toContain('Drop an image here')
+
+		findButton('Upload image')?.click()
+		await flushPromises()
+
 		expect(FakeXMLHttpRequest.instances).toHaveLength(1)
 		expect(latestXHR().url).toBe('/v1/article/12/image')
 		expect((latestXHR().sentBody?.get('file') as File).name).toBe('before.png')
@@ -235,6 +248,9 @@ describe('A successful upload inserts the image at the cursor and marks the draf
 		fileInput.dispatchEvent(new Event('change'))
 		await flushPromises()
 
+		findButton('Upload image')?.click()
+		await flushPromises()
+
 		expect(FakeXMLHttpRequest.instances).toHaveLength(1)
 		latestXHR().resolve(
 			201,