fix(html reporter): render annotation newlines (#32948)

Closes https://github.com/microsoft/playwright/issues/32925. Before this
change, newlines in annotation descriptions weren't respected. This
change makes them shown. Here's how it looks for this annotation:

```ts
test.info().annotations.push({
  type: 'user story',
  description: '\n- user goes to the page\n- user clicks the button\n- user sees the result',
});
```

Before:

<img width="1071" alt="Screenshot 2024-10-04 at 09 55 15"
src="https://github.com/user-attachments/assets/89e74ff5-ea83-48da-a33b-833423916d95">

After:

<img width="1031" alt="Screenshot 2024-10-04 at 09 51 08"
src="https://github.com/user-attachments/assets/0f2914e8-bd88-4970-aa68-6a5a9828295c">

packages/html-reporter/src/testCaseView.css

@@ -61,6 +61,7 @@
   align-items: center;
   padding: 0 8px;
   line-height: 24px;
+  white-space: pre-wrap;
 }
 
 @media only screen and (max-width: 600px) {