1import React from 'react';
2import { render, screen } from '@testing-library/react';
3import { Input } from '../Input/Input';
4import { InlineField } from './InlineField';
5import { Select } from '../Select/Select';
6
7describe('InlineField', () => {
8  it('renders the label', () => {
9    render(
10      <InlineField label="My label">
11        <Input id="my-text-input" />
12      </InlineField>
13    );
14
15    expect(screen.getByText('My label')).toBeInTheDocument();
16  });
17
18  it('renders with the id of its children', () => {
19    render(
20      <InlineField label="My label">
21        <Input id="my-text-input" />
22      </InlineField>
23    );
24
25    expect(screen.getByLabelText('My label')).toBeInTheDocument();
26  });
27
28  it('renders with the inputId of its children', () => {
29    render(
30      <InlineField label="My other label">
31        <Select menuShouldPortal inputId="my-select-input" onChange={() => {}} />
32      </InlineField>
33    );
34
35    expect(screen.getByLabelText('My other label')).toBeInTheDocument();
36  });
37});
38