@12-apps/ui 1.5.0 → 1.5.1

package/src/components/form/Textarea/Textarea.test.stories.tsx

@@ -1,702 +0,0 @@
-import { Box, createTheme,ThemeProvider } from '@mui/material';
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { expect, userEvent, waitFor, within } from 'storybook/test';
-
-import { Textarea } from './Textarea';
-
-const meta: Meta<typeof Textarea> = {
-  title: 'Form/Textarea/Tests',
-  component: Textarea,
-  parameters: {
-    layout: 'centered',
-    chromatic: { disableSnapshot: false },
-  },
-  tags: ['autodocs', 'test', 'component:Textarea'],
-};
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-// 1. Basic Interaction Tests
-export const BasicInteraction: Story = {
-  args: {
-    placeholder: 'Type your message here...',
-    'dataTestId': 'basic-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Find textarea element', async () => {
-      const textarea = canvas.getByRole('textbox');
-      expect(textarea).toBeInTheDocument();
-      expect(textarea).toHaveAttribute('placeholder', 'Type your message here...');
-    });
-
-    await step('Type text into textarea', async () => {
-      const textarea = canvas.getByRole('textbox');
-      await userEvent.click(textarea);
-      await userEvent.type(textarea, 'Hello World!\nThis is a second line.');
-      expect(textarea).toHaveValue('Hello World!\nThis is a second line.');
-    });
-
-    await step('Clear and retype text', async () => {
-      const textarea = canvas.getByRole('textbox');
-      await userEvent.clear(textarea);
-      await userEvent.type(textarea, 'New content');
-      expect(textarea).toHaveValue('New content');
-    });
-
-    await step('Verify special character input', async () => {
-      const textarea = canvas.getByRole('textbox');
-      await userEvent.clear(textarea);
-      // Test various special characters without problematic brackets
-      await userEvent.type(textarea, 'Special chars: @#$%^&*()_+-=;:,.<>?/~`');
-      expect(textarea).toHaveValue('Special chars: @#$%^&*()_+-=;:,.<>?/~`');
-    });
-  },
-};
-
-// 2. Form Interaction Tests
-export const FormInteraction: Story = {
-  args: {
-    placeholder: 'Enter form message...',
-    name: 'message',
-    required: true,
-    'dataTestId': 'form-textarea',
-  },
-  decorators: [
-    (Story) => (
-      <form>
-        <Story />
-        <button type="submit">Submit</button>
-      </form>
-    ),
-  ],
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Interact with textarea in form context', async () => {
-      const textarea = canvas.getByRole('textbox');
-      const submitButton = canvas.getByRole('button', { name: 'Submit' });
-
-      expect(textarea).toBeInTheDocument();
-      expect(textarea).toHaveAttribute('name', 'message');
-      expect(textarea).toHaveAttribute('required');
-      expect(submitButton).toBeInTheDocument();
-    });
-
-    await step('Fill textarea and verify form data', async () => {
-      const textarea = canvas.getByRole('textbox');
-      await userEvent.click(textarea);
-      await userEvent.type(textarea, 'Form submission test\nMultiple lines supported');
-      expect(textarea).toHaveValue('Form submission test\nMultiple lines supported');
-    });
-
-    await step('Test form validation behavior', async () => {
-      const textarea = canvas.getByRole('textbox');
-      await userEvent.clear(textarea);
-
-      // Required field should trigger validation when empty
-      expect(textarea).toHaveValue('');
-      expect(textarea).toHaveAttribute('required');
-    });
-  },
-};
-
-// 3. Rich Text Editor Tests
-export const RichTextEditor: Story = {
-  args: {
-    variant: 'rich',
-    placeholder: 'Rich text editor...',
-    label: 'Rich Text Content',
-    'dataTestId': 'rich-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Find rich text editor components', async () => {
-      const label = canvas.getByText('Rich Text Content');
-      expect(label).toBeInTheDocument();
-
-      // Look for toolbar buttons
-      const boldButton = canvas.getByRole('button', { name: /bold/i });
-      const italicButton = canvas.getByRole('button', { name: /italic/i });
-      expect(boldButton).toBeInTheDocument();
-      expect(italicButton).toBeInTheDocument();
-    });
-
-    await step('Test rich text toolbar interactions', async () => {
-      const boldButton = canvas.getByRole('button', { name: /bold/i });
-      const italicButton = canvas.getByRole('button', { name: /italic/i });
-
-      // Click toolbar buttons
-      await userEvent.click(boldButton);
-      await userEvent.click(italicButton);
-
-      // Toolbar buttons should be interactive
-      expect(boldButton).toBeEnabled();
-      expect(italicButton).toBeEnabled();
-    });
-
-    await step('Test content editing in rich text mode', async () => {
-      // Find the contenteditable div
-      const editableArea =
-        canvas.getByRole('textbox') || canvasElement.querySelector('[contenteditable="true"]');
-
-      if (editableArea) {
-        await userEvent.click(editableArea);
-        // Rich text editor should be focusable
-        await waitFor(() => expect(document.activeElement).toBe(editableArea));
-      }
-    });
-  },
-};
-
-// 4. Keyboard Navigation Tests
-export const KeyboardNavigation: Story = {
-  args: {
-    placeholder: 'Test keyboard navigation...',
-    'dataTestId': 'keyboard-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Focus textarea with Tab key', async () => {
-      const textarea = canvas.getByRole('textbox');
-
-      // Tab to focus
-      await userEvent.tab();
-      await waitFor(() => expect(textarea).toHaveFocus());
-    });
-
-    await step('Test Enter key behavior', async () => {
-      const textarea = canvas.getByRole('textbox');
-      await userEvent.click(textarea);
-      await userEvent.type(textarea, 'First line');
-      await userEvent.keyboard('{Enter}');
-      await userEvent.type(textarea, 'Second line');
-
-      expect(textarea).toHaveValue('First line\nSecond line');
-    });
-
-    await step('Test text selection with keyboard shortcuts', async () => {
-      const textarea = canvas.getByRole('textbox');
-      await userEvent.click(textarea);
-      await userEvent.clear(textarea);
-      await userEvent.type(textarea, 'Select this text');
-
-      // Select all text with Ctrl+A
-      await userEvent.keyboard('{Control>}a{/Control}');
-
-      // Text should be selected (we can't directly test selection, but the command should execute)
-      expect(textarea).toHaveValue('Select this text');
-    });
-
-    await step('Test Escape key behavior', async () => {
-      const textarea = canvas.getByRole('textbox');
-      await userEvent.click(textarea);
-      await userEvent.keyboard('{Escape}');
-
-      // Textarea should still be accessible after Escape
-      expect(textarea).toBeInTheDocument();
-    });
-  },
-};
-
-// 5. Screen Reader Tests
-export const ScreenReader: Story = {
-  args: {
-    placeholder: 'Screen reader accessible textarea',
-    label: 'Accessible Textarea',
-    helperText: 'This textarea is accessible to screen readers',
-    'aria-describedby': 'helper-text',
-    'dataTestId': 'sr-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Verify ARIA attributes', async () => {
-      const textarea = canvas.getByRole('textbox');
-      const label = canvas.getByText('Accessible Textarea');
-      const helperText = canvas.getByText('This textarea is accessible to screen readers');
-
-      expect(textarea).toBeInTheDocument();
-      expect(label).toBeInTheDocument();
-      expect(helperText).toBeInTheDocument();
-
-      // Check accessibility attributes
-      expect(textarea).toHaveAccessibleName('Accessible Textarea');
-      expect(textarea).toHaveAttribute('aria-describedby');
-    });
-
-    await step('Test screen reader announcements', async () => {
-      const textarea = canvas.getByRole('textbox');
-
-      // Focus should announce the textarea
-      await userEvent.click(textarea);
-      await waitFor(() => expect(textarea).toHaveFocus());
-
-      // Type content and verify it's available to screen readers
-      await userEvent.type(textarea, 'Screen reader content');
-      expect(textarea).toHaveValue('Screen reader content');
-    });
-
-    await step('Test error state accessibility', async () => {
-      const textarea = canvas.getByRole('textbox');
-
-      // Textarea should be accessible and have proper state information
-      expect(textarea).toBeInTheDocument();
-      expect(textarea).not.toHaveAttribute('aria-invalid', 'true');
-    });
-  },
-};
-
-// 6. Focus Management Tests
-export const FocusManagement: Story = {
-  decorators: [
-    (Story) => (
-      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
-        <input placeholder="Previous input" data-testid="prev-input" />
-        <Story />
-        <input placeholder="Next input" data-testid="next-input" />
-      </Box>
-    ),
-  ],
-  args: {
-    placeholder: 'Focus management test...',
-    'dataTestId': 'focus-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Test focus sequence', async () => {
-      const prevInput = canvas.getByTestId('prev-input');
-      const textarea = canvas.getByTestId('focus-textarea');
-      const nextInput = canvas.getByTestId('next-input');
-
-      // Start with previous input
-      await userEvent.click(prevInput);
-      await waitFor(() => expect(prevInput).toHaveFocus());
-
-      // Tab to textarea
-      await userEvent.tab();
-      await waitFor(() => expect(textarea).toHaveFocus());
-
-      // Tab to next input
-      await userEvent.tab();
-      await waitFor(() => expect(nextInput).toHaveFocus());
-    });
-
-    await step('Test focus retention during interaction', async () => {
-      const textarea = canvas.getByTestId('focus-textarea');
-
-      await userEvent.click(textarea);
-      await waitFor(() => expect(textarea).toHaveFocus());
-
-      await userEvent.type(textarea, 'Typing should maintain focus');
-      await waitFor(() => expect(textarea).toHaveFocus());
-      expect(textarea).toHaveValue('Typing should maintain focus');
-    });
-
-    await step('Test blur behavior', async () => {
-      const textarea = canvas.getByTestId('focus-textarea');
-      const nextInput = canvas.getByTestId('next-input');
-
-      await userEvent.click(textarea);
-      await waitFor(() => expect(textarea).toHaveFocus());
-
-      // Click outside to blur
-      await userEvent.click(nextInput);
-      await waitFor(() => expect(textarea).not.toHaveFocus());
-      await waitFor(() => expect(nextInput).toHaveFocus());
-    });
-  },
-};
-
-// 7. Responsive Design Tests
-export const ResponsiveDesign: Story = {
-  parameters: {
-    viewport: {
-      viewports: {
-        mobile: { name: 'Mobile', styles: { width: '375px', height: '667px' } },
-        tablet: { name: 'Tablet', styles: { width: '768px', height: '1024px' } },
-        desktop: { name: 'Desktop', styles: { width: '1200px', height: '800px' } },
-      },
-    },
-  },
-  args: {
-    placeholder: 'Responsive textarea...',
-    size: 'md',
-    'dataTestId': 'responsive-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Verify textarea renders on different viewports', async () => {
-      const textarea = canvas.getByRole('textbox');
-      expect(textarea).toBeInTheDocument();
-      expect(textarea).toBeVisible();
-    });
-
-    await step('Test interaction on small screens', async () => {
-      const textarea = canvas.getByRole('textbox');
-
-      await userEvent.click(textarea);
-      await userEvent.type(textarea, 'Mobile responsive content');
-      expect(textarea).toHaveValue('Mobile responsive content');
-    });
-
-    await step('Verify accessibility on touch devices', async () => {
-      const textarea = canvas.getByRole('textbox');
-
-      // Touch target should be large enough - we verify the element exists and is accessible
-      expect(textarea).toBeInTheDocument();
-      expect(textarea).toBeVisible();
-      // Note: We can't easily test computed dimensions in Storybook tests
-    });
-  },
-};
-
-// 8. Theme Variations Tests
-export const ThemeVariations: Story = {
-  decorators: [
-    (Story) => {
-      const lightTheme = createTheme({ palette: { mode: 'light' } });
-      const darkTheme = createTheme({ palette: { mode: 'dark' } });
-
-      return (
-        <Box sx={{ display: 'flex', gap: 3, flexWrap: 'wrap' }}>
-          <Box>
-            <h3>Light Theme</h3>
-            <ThemeProvider theme={lightTheme}>
-              <Story />
-            </ThemeProvider>
-          </Box>
-          <Box>
-            <h3>Dark Theme</h3>
-            <ThemeProvider theme={darkTheme}>
-              <Story />
-            </ThemeProvider>
-          </Box>
-        </Box>
-      );
-    },
-  ],
-  args: {
-    placeholder: 'Theme test textarea...',
-    label: 'Theme Textarea',
-    color: 'primary',
-    'dataTestId': 'theme-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Find textareas in both themes', async () => {
-      const textareas = canvas.getAllByRole('textbox');
-      expect(textareas).toHaveLength(2); // Light and dark theme versions
-    });
-
-    await step('Test interaction in both themes', async () => {
-      const textareas = canvas.getAllByRole('textbox');
-
-      for (const textarea of textareas) {
-        await userEvent.click(textarea);
-        await userEvent.type(textarea, 'Theme test');
-        expect(textarea).toHaveValue('Theme test');
-        await userEvent.clear(textarea);
-      }
-    });
-
-    await step('Verify theme-specific styling', async () => {
-      const textareas = canvas.getAllByRole('textbox');
-
-      // Both textareas should be rendered and functional
-      textareas.forEach((textarea) => {
-        expect(textarea).toBeVisible();
-        expect(textarea).not.toHaveAttribute('disabled');
-      });
-    });
-  },
-};
-
-// 9. Visual States Tests
-export const VisualStates: Story = {
-  render: () => (
-    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}>
-      <Box>
-        <h4>Default State</h4>
-        <Textarea placeholder="Default state..." dataTestId="default-textarea" />
-      </Box>
-      <Box>
-        <h4>Disabled State</h4>
-        <Textarea placeholder="Disabled state..." disabled dataTestId="disabled-textarea" />
-      </Box>
-      <Box>
-        <h4>Error State</h4>
-        <Textarea
-          placeholder="Error state..."
-          error
-          helperText="This field has an error"
-          dataTestId="error-textarea"
-        />
-      </Box>
-      <Box>
-        <h4>Glass Effect</h4>
-        <Textarea placeholder="Glass effect..." glass dataTestId="glass-textarea" />
-      </Box>
-    </Box>
-  ),
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Verify all visual states render', async () => {
-      const defaultTextarea = canvas.getByTestId('default-textarea');
-      const disabledTextarea = canvas.getByTestId('disabled-textarea');
-      const errorTextarea = canvas.getByTestId('error-textarea');
-      const glassTextarea = canvas.getByTestId('glass-textarea');
-
-      expect(defaultTextarea).toBeInTheDocument();
-      expect(disabledTextarea).toBeInTheDocument();
-      expect(errorTextarea).toBeInTheDocument();
-      expect(glassTextarea).toBeInTheDocument();
-    });
-
-    await step('Test disabled state behavior', async () => {
-      const disabledTextarea = canvas.getByTestId('disabled-textarea');
-
-      expect(disabledTextarea).toBeDisabled();
-
-      // Should not accept input when disabled
-      await userEvent.click(disabledTextarea);
-      await waitFor(() => expect(disabledTextarea).not.toHaveFocus());
-    });
-
-    await step('Test interactive states', async () => {
-      const defaultTextarea = canvas.getByTestId('default-textarea');
-      const errorTextarea = canvas.getByTestId('error-textarea');
-      const glassTextarea = canvas.getByTestId('glass-textarea');
-
-      // Test focus states
-      await userEvent.click(defaultTextarea);
-      await waitFor(() => expect(defaultTextarea).toHaveFocus());
-
-      await userEvent.click(errorTextarea);
-      await waitFor(() => expect(errorTextarea).toHaveFocus());
-
-      await userEvent.click(glassTextarea);
-      await waitFor(() => expect(glassTextarea).toHaveFocus());
-    });
-
-    await step('Test error state helper text', async () => {
-      const helperText = canvas.getByText('This field has an error');
-      expect(helperText).toBeInTheDocument();
-    });
-  },
-};
-
-// 10. Performance Tests
-export const Performance: Story = {
-  args: {
-    placeholder: 'Performance test textarea...',
-    'dataTestId': 'performance-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Measure initial render performance', async () => {
-      const textarea = canvas.getByTestId('performance-textarea');
-
-      expect(textarea).toBeInTheDocument();
-      expect(endTime - startTime).toBeLessThan(100); // Should render quickly
-    });
-
-    await step('Test typing performance with large content', async () => {
-      const textarea = canvas.getByTestId('performance-textarea');
-      // Reduced from 1000 to 200 characters for faster test execution
-      const longText = 'A'.repeat(200);
-
-      await userEvent.click(textarea);
-      await userEvent.type(textarea, longText, { delay: 0 });
-
-      expect(textarea).toHaveValue(longText);
-      expect(endTime - startTime).toBeLessThan(10000); // Reduced from 30s to 10s
-    });
-
-    await step('Test multiple rapid interactions', async () => {
-      const textarea = canvas.getByTestId('performance-textarea');
-
-      // Reduced from 10 to 5 iterations for faster test execution
-      for (let i = 0; i < 5; i++) {
-        await userEvent.clear(textarea);
-        await userEvent.type(textarea, `Content ${i}`, { delay: 0 });
-      }
-
-      expect(textarea).toHaveValue('Content 4');
-      expect(endTime - startTime).toBeLessThan(10000); // Reduced from 30s to 10s
-    });
-  },
-  parameters: {
-    test: {
-      timeout: 10000, // 10 second timeout for performance tests
-    },
-  },
-};
-
-// 11. Edge Cases Tests
-export const EdgeCases: Story = {
-  decorators: [
-    () => (
-      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}>
-        <Box>
-          <h4>Empty State</h4>
-          <Textarea placeholder="Empty placeholder..." dataTestId="empty-textarea" />
-        </Box>
-        <Box>
-          <h4>With Max Length</h4>
-          <Textarea placeholder="Max 10 chars..." maxLength={10} dataTestId="maxlength-textarea" />
-        </Box>
-        <Box>
-          <h4>Pre-filled Content</h4>
-          <Textarea defaultValue="Pre-filled content here" dataTestId="prefilled-textarea" />
-        </Box>
-      </Box>
-    ),
-  ],
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Test empty state behavior', async () => {
-      const emptyTextarea = canvas.getByTestId('empty-textarea');
-
-      expect(emptyTextarea).toHaveValue('');
-      expect(emptyTextarea).toHaveAttribute('placeholder', 'Empty placeholder...');
-    });
-
-    await step('Test max length constraint', async () => {
-      const maxLengthTextarea = canvas.getByTestId<HTMLTextAreaElement>('maxlength-textarea');
-
-      await userEvent.click(maxLengthTextarea);
-      await userEvent.type(maxLengthTextarea, 'This text is longer than 10 characters', { delay: 0 });
-
-      // Should be truncated to max length
-      const value = maxLengthTextarea.value;
-      expect(value.length).toBeLessThanOrEqual(10);
-    });
-
-    await step('Test pre-filled content', async () => {
-      const prefilledTextarea = canvas.getByTestId('prefilled-textarea');
-
-      expect(prefilledTextarea).toHaveValue('Pre-filled content here');
-
-      // Should be able to edit pre-filled content
-      await userEvent.click(prefilledTextarea);
-      await userEvent.clear(prefilledTextarea);
-      await userEvent.type(prefilledTextarea, 'New content', { delay: 0 });
-      expect(prefilledTextarea).toHaveValue('New content');
-    });
-
-    await step('Test special character input', async () => {
-      const emptyTextarea = canvas.getByTestId('empty-textarea');
-
-      await userEvent.clear(emptyTextarea);
-      // Simplified test text for faster execution
-      await userEvent.type(emptyTextarea, 'Special: @#$ abc', { delay: 0 });
-      expect(emptyTextarea).toHaveValue('Special: @#$ abc');
-    });
-
-    await step('Test newline handling', async () => {
-      const emptyTextarea = canvas.getByTestId('empty-textarea');
-
-      await userEvent.clear(emptyTextarea);
-      await userEvent.type(emptyTextarea, 'Line 1\nLine 2', { delay: 0 });
-      expect(emptyTextarea).toHaveValue('Line 1\nLine 2');
-    });
-  },
-  parameters: {
-    test: {
-      timeout: 10000, // 10 second timeout for edge case tests
-    },
-  },
-};
-
-// 12. Integration Tests
-export const Integration: Story = {
-  decorators: [
-    (Story) => (
-      <Box component="form" sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
-        <input placeholder="Name" data-testid="name-input" />
-        <Story />
-        <Textarea placeholder="Additional comments..." data-testid="comments-textarea" />
-        <button type="submit">Submit Form</button>
-      </Box>
-    ),
-  ],
-  args: {
-    placeholder: 'Main message...',
-    name: 'message',
-    required: true,
-    label: 'Message',
-    helperText: 'Please enter your message',
-    'dataTestId': 'integration-textarea',
-  },
-  play: async ({ canvasElement, step }) => {
-    const canvas = within(canvasElement);
-
-    await step('Verify form integration setup', async () => {
-      const nameInput = canvas.getByTestId('name-input');
-      const messageTextarea = canvas.getByTestId('integration-textarea');
-      const commentsTextarea = canvas.getByTestId('comments-textarea');
-      const submitButton = canvas.getByRole('button', { name: 'Submit Form' });
-
-      expect(nameInput).toBeInTheDocument();
-      expect(messageTextarea).toBeInTheDocument();
-      expect(commentsTextarea).toBeInTheDocument();
-      expect(submitButton).toBeInTheDocument();
-    });
-
-    await step('Test tab navigation through form', async () => {
-      const nameInput = canvas.getByTestId('name-input');
-      const messageTextarea = canvas.getByTestId('integration-textarea');
-      const commentsTextarea = canvas.getByTestId('comments-textarea');
-      const submitButton = canvas.getByRole('button', { name: 'Submit Form' });
-
-      await userEvent.click(nameInput);
-      await waitFor(() => expect(nameInput).toHaveFocus());
-
-      await userEvent.tab();
-      await waitFor(() => expect(messageTextarea).toHaveFocus());
-
-      await userEvent.tab();
-      await waitFor(() => expect(commentsTextarea).toHaveFocus());
-
-      await userEvent.tab();
-      await waitFor(() => expect(submitButton).toHaveFocus());
-    });
-
-    await step('Fill form with data', async () => {
-      const nameInput = canvas.getByTestId('name-input');
-      const messageTextarea = canvas.getByTestId('integration-textarea');
-      const commentsTextarea = canvas.getByTestId('comments-textarea');
-
-      await userEvent.click(nameInput);
-      await userEvent.type(nameInput, 'John Doe');
-      expect(nameInput).toHaveValue('John Doe');
-
-      await userEvent.click(messageTextarea);
-      await userEvent.type(messageTextarea, 'This is the main message\nwith multiple lines.');
-      expect(messageTextarea).toHaveValue('This is the main message\nwith multiple lines.');
-
-      await userEvent.click(commentsTextarea);
-      await userEvent.type(commentsTextarea, 'Additional comments here.');
-      expect(commentsTextarea).toHaveValue('Additional comments here.');
-    });
-
-    await step('Test form validation integration', async () => {
-      const messageTextarea = canvas.getByTestId('integration-textarea');
-      const helperText = canvas.getByText('Please enter your message');
-
-      expect(messageTextarea).toHaveAttribute('required');
-      expect(helperText).toBeInTheDocument();
-    });
-  },
-};