diff --git a/web/e2e/helpers.js b/web/e2e/helpers.js
index 05dbe11..30f8aed 100644
--- a/web/e2e/helpers.js
+++ b/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')
 	};
 }
diff --git a/web/e2e/pvp-game.spec.js b/web/e2e/pvp-game.spec.js
index 0e4861f..b4ebfd6 100644
--- a/web/e2e/pvp-game.spec.js
+++ b/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();
diff --git a/web/src/lib/components/ChatPanel.svelte b/web/src/lib/components/ChatPanel.svelte
index 3f3ecc9..df14383 100644
--- a/web/src/lib/components/ChatPanel.svelte
+++ b/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>