From a8098a6da762989b3a44a9f35ded158f1c9a7b3f Mon Sep 17 00:00:00 2001
From: axel7083 <42176370+axel7083@users.noreply.github.com>
Date: Tue, 30 Jan 2024 12:30:02 +0100
Subject: [PATCH] test: ensuring alert component is displayed if QueryState
 send one

---
 .../src/pages/ModelPlayground.spec.ts         | 30 +++++++++++++++++++
 1 file changed, 30 insertions(+)

diff --git a/packages/frontend/src/pages/ModelPlayground.spec.ts b/packages/frontend/src/pages/ModelPlayground.spec.ts
index 14617bd68..a636368c4 100644
--- a/packages/frontend/src/pages/ModelPlayground.spec.ts
+++ b/packages/frontend/src/pages/ModelPlayground.spec.ts
@@ -140,3 +140,33 @@ test('should display query without response', async () => {
   expect(response).toBeInTheDocument();
   expect(response).toHaveValue('The response is 2');
 });
+
+test('should display error alert', async () => {
+  mocks.playgroundQueriesSubscribeMock.mockReturnValue([
+    {
+      id: 1,
+      modelId: 'model1',
+      prompt: 'what is 1+1?',
+      error: 'dummy error'
+    },
+  ]);
+  render(ModelPlayground, {
+    model: {
+      id: 'model1',
+      name: 'Model 1',
+      description: 'A description',
+      hw: 'CPU',
+      registry: 'Hugging Face',
+      popularity: 3,
+      license: '?',
+      url: 'https://huggingface.co/TheBloke/Llama-2-7B-Chat-GGUF/resolve/main/llama-2-7b-chat.Q5_K_S.gguf',
+    } as ModelInfo,
+  });
+
+  await waitFor(() => {
+    const alert = screen.getByRole('alert');
+    expect(alert).toBeDefined();
+  });
+
+});
+