fix: more complete log in username error messages

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

@@ -133,6 +133,25 @@ describe('Validation errors — nothing is sent for a short username and an empt
 	})
 })
 
+describe('Validation errors — specific username messages', () => {
+	it.each([
+		['marta@example.com', 'Use your username, not your email address.'],
+		['a'.repeat(21), 'Use 20 characters or fewer.'],
+	])('explains why %s is rejected without calling the API', async (value, message) => {
+		const login = vi.fn(() => mockResponse(200))
+		const wrapper = await mountLogin('/login', {
+			'POST /v1/auth/login': login,
+		})
+
+		await wrapper.find('input[placeholder="Your username"]').setValue(value)
+		await wrapper.find('form').trigger('submit')
+		await flushPromises()
+
+		expect(login).not.toHaveBeenCalled()
+		expect(wrapper.text()).toContain(message)
+	})
+})
+
 describe('Submitting — fields and button are disabled while the request is in flight', () => {
 	it('disables the fields and shows the loading label', async () => {
 		let resolveLogin: (() => void) | null = null