@aws-amplify/ui-react-native 1.2.22 → 1.2.24

package/src/primitives/RadioGroup/__tests__/RadioGroup.spec.tsx

@@ -1,183 +0,0 @@
-import React, { useState } from 'react';
-import { fireEvent, render, renderHook } from '@testing-library/react-native';
-
-import { useTheme } from '../../../theme';
-import { getThemedStyles as getThemedLabelStyles } from '../../Label/styles';
-import { Radio } from '../../Radio';
-import { Size } from '../../Radio/types';
-
-import RadioGroup from '../RadioGroup';
-import { Direction } from '../types';
-
-const directions: Direction[] = ['vertical', 'horizontal'];
-const sizes: Size[] = ['small', 'medium', 'large'];
-
-const onChangeMock = jest.fn();
-
-const ControlledRadioGroup = ({
-  onChange,
-  ...rest
-}: {
-  onChange?: jest.Mock<any, any>;
-  direction?: Direction;
-  size?: Size;
-  disabled?: boolean;
-}) => {
-  const [value, setValue] = useState('option-1');
-  const handleOnChange = (nextValue: string) => {
-    setValue(nextValue);
-    onChange?.(nextValue);
-  };
-
-  return (
-    <RadioGroup
-      {...rest}
-      initialValue={value}
-      onChange={(nextValue) => {
-        if (typeof nextValue === 'string') {
-          handleOnChange(nextValue);
-        }
-      }}
-    >
-      <Radio value="option-1" label="Option 1" />
-      <Radio value="option-2" label="Option 2" />
-      <Radio value="option-3" label="Option 3" />
-      <Radio value="option-4" label="Option 4" disabled />
-    </RadioGroup>
-  );
-};
-
-describe('RadioGroup', () => {
-  beforeEach(() => {
-    onChangeMock.mockClear();
-  });
-
-  it('renders default RadioGroup as expected', () => {
-    const { queryAllByRole, toJSON } = render(<ControlledRadioGroup />);
-
-    const radios = queryAllByRole('radio');
-    expect(radios.length).toBe(4);
-
-    expect(toJSON()).toMatchSnapshot();
-  });
-
-  it('allows users to select radios', () => {
-    const { getByText } = render(
-      <ControlledRadioGroup onChange={onChangeMock} />
-    );
-
-    const option2 = getByText('Option 2');
-    const option3 = getByText('Option 3');
-
-    fireEvent.press(option2);
-    expect(onChangeMock).toBeCalledWith('option-2');
-
-    fireEvent.press(option3);
-    expect(onChangeMock).toBeCalledWith('option-3');
-  });
-
-  it('does not execute the callback when disabled', () => {
-    const { getByText } = render(
-      <ControlledRadioGroup disabled onChange={onChangeMock} />
-    );
-
-    const option2 = getByText('Option 2');
-
-    fireEvent.press(option2);
-    expect(onChangeMock).not.toHaveBeenCalled();
-  });
-
-  it.each(directions)('renders as expected when direction is %s', (value) => {
-    const { toJSON } = render(<ControlledRadioGroup direction={value} />);
-    expect(toJSON()).toMatchSnapshot();
-  });
-
-  it.each(sizes)('renders as expected when size is %s', (value) => {
-    const { toJSON } = render(<ControlledRadioGroup size={value} />);
-    expect(toJSON()).toMatchSnapshot();
-  });
-
-  it('updates the selected option in uncontrolled mode', () => {
-    const { getByTestId, queryByTestId } = render(
-      <RadioGroup>
-        <Radio value="option-1" label="Option 1" testID="option-1" />
-        <Radio value="option-2" label="Option 2" testID="option-2" />
-      </RadioGroup>
-    );
-
-    const selectedOption = queryByTestId('amplify__radio-button__dot');
-
-    expect(selectedOption).toBeNull();
-
-    const optionOne = getByTestId('option-1');
-
-    fireEvent.press(optionOne);
-
-    expect(queryByTestId('amplify__radio-button__dot')).toBeDefined();
-  });
-
-  it('only calls onValueChange when value changes', () => {
-    const onValueChange = jest.fn();
-
-    const { getByTestId, rerender } = render(
-      <RadioGroup onValueChange={onValueChange}>
-        <Radio value="option-1" label="Option 1" testID="option-1" />
-        <Radio value="option-2" label="Option 2" testID="option-2" />
-      </RadioGroup>
-    );
-
-    const optionOne = getByTestId('option-1');
-
-    fireEvent.press(optionOne);
-
-    expect(onValueChange).toHaveBeenCalledTimes(1);
-    expect(onValueChange).toHaveBeenCalledWith('option-1');
-
-    const updatedOnValueChange = jest.fn();
-
-    rerender(
-      <RadioGroup onValueChange={updatedOnValueChange}>
-        <Radio value="option-1" label="Option 1" testID="option-1" />
-        <Radio value="option-2" label="Option 2" testID="option-2" />
-      </RadioGroup>
-    );
-
-    expect(updatedOnValueChange).not.toHaveBeenCalled();
-  });
-
-  it('renders the label prop', () => {
-    const label = 'label';
-    const { getByText } = render(
-      <RadioGroup label={label}>
-        <Radio value="option-1" label="Option 1" testID="option-1" />
-        <Radio value="option-2" label="Option 1" testID="option-2" />
-      </RadioGroup>
-    );
-
-    expect(getByText(label)).toBeDefined();
-  });
-
-  it('applies theme and custom styles', () => {
-    const labelText = 'Test label';
-    const customLabelStyle = { color: 'red' };
-    const themedRadioGroupLabelStyle = {};
-
-    const { getByText } = render(
-      <RadioGroup label={labelText} labelStyle={customLabelStyle}>
-        <Radio value="option-1" label="Option 1" testID="option-1" />
-        <Radio value="option-2" label="Option 1" testID="option-2" />
-      </RadioGroup>
-    );
-
-    const { result } = renderHook(() => useTheme());
-    const themedStyle = getThemedLabelStyles(result.current);
-
-    const label = getByText(labelText);
-
-    expect(label.props.style).toStrictEqual([
-      themedStyle.text,
-      themedStyle['primary'],
-      [themedRadioGroupLabelStyle, customLabelStyle],
-    ]);
-  });
-});