refactor(code_block): remove all snapshot tests and redundant describ…

…e blocks (#8185)

packages/eui/src/components/code/code_block.stories.tsx

@@ -6,9 +6,14 @@
  * Side Public License, v 1.
  */
 
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj, ReactRenderer } from '@storybook/react';
+import type { PlayFunctionContext } from '@storybook/csf';
+
+import { within } from '../../../.storybook/test';
+import { LOKI_SELECTORS } from '../../../.storybook/loki';
 
 import { EuiCodeBlock, EuiCodeBlockProps } from './code_block';
+import { expect, userEvent } from '@storybook/test';
 
 const meta: Meta<EuiCodeBlockProps> = {
   title: 'Editors & Syntax/EuiCodeBlock',
@@ -32,10 +37,68 @@ const meta: Meta<EuiCodeBlockProps> = {
 export default meta;
 type Story = StoryObj<EuiCodeBlockProps>;
 
+const htmlCode = `<p>
+  <!-- Hello world -->
+</p>`;
+
 export const Playground: Story = {
   args: {
-    children: `<p>
-  <!-- Hello world -->
-</p>`,
+    children: htmlCode,
+  },
+};
+
+export const StartValue: Story = {
+  args: {
+    children: htmlCode,
+    language: 'html',
+    lineNumbers: {
+      start: 10,
+    },
+  },
+  argTypes: {
+    lineNumbers: { table: { disable: true } },
+  },
+};
+
+export const HighlightedLines: Story = {
+  args: {
+    children: htmlCode,
+    language: 'html',
+    lineNumbers: {
+      highlight: '1,3',
+    },
+  },
+  argTypes: {
+    lineNumbers: { table: { disable: true } },
+  },
+};
+
+export const Annotations: Story = {
+  args: {
+    children: htmlCode,
+    language: 'html',
+    lineNumbers: {
+      annotations: {
+        2: 'Hello world',
+      },
+    },
+  },
+  argTypes: {
+    lineNumbers: { table: { disable: true } },
+  },
+  parameters: {
+    loki: { chromeSelector: LOKI_SELECTORS.portal },
+  },
+  play: async ({ canvasElement }: PlayFunctionContext<ReactRenderer>) => {
+    const canvas = within(canvasElement);
+    const annotationButton = await canvas.findByRole('button', {
+      name: 'Click to view a code annotation for line 2',
+    });
+
+    userEvent.click(annotationButton);
+
+    const dialog = await canvas.findByRole('dialog');
+
+    expect(dialog).toHaveTextContent('Hello world');
   },
 };

packages/eui/src/components/code/code_block.styles.ts

@@ -5,13 +5,6 @@
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
 
 import { css } from '@emotion/react';
 import {