test(e2e): reach the chat panel's toggle by its own handle

A role query by name matched both the panel toggle and the board's pill,
since the pill's label contains the panel's. The spec now names the
control it means.

web/e2e/helpers.js

@@ -100,6 +100,7 @@ export function chat(page) {
 		log: page.getByTestId('chat-log'),
 		input: page.getByTestId('chat-input'),
 		send: page.getByTestId('chat-send'),
+		toggle: page.getByTestId('chat-toggle'),
 		unread: page.getByTestId('chat-unread')
 	};
 }

web/e2e/pvp-game.spec.js

@@ -484,11 +484,11 @@ test.describe('playing a stranger', () => {
 		// And it does start counting what actually arrives while folded. The
 		// guest's panel is folded too, so it has to be opened before there is
 		// anything to type into.
-		await guest.getByRole('button', { name: 'Trò chuyện' }).click();
+		await chat(guest).toggle.click();
 		await say(guest, 'ba');
 		await expect(chat(host).unread).toHaveText('1 tin mới');
 
-		await host.getByRole('button', { name: 'Trò chuyện' }).click();
+		await chat(host).toggle.click();
 		await expect(chat(host).unread).toHaveCount(0);
 
 		await close();

web/src/lib/components/ChatPanel.svelte

@@ -139,7 +139,7 @@
 
 <section class="chat" aria-label={t.chatTitle}>
 	{#if collapsible}
-		<button type="button" class="header" aria-expanded={open} onclick={toggle}>
+		<button type="button" class="header" aria-expanded={open} onclick={toggle} data-testid="chat-toggle">
 			<span>{t.chatTitle}</span>
 			{#if unread > 0}
 				<span class="badge" data-testid="chat-unread">{fill(t.chatUnread, { n: unread })}</span>