fix: allow form label and name to differ

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
This commit is contained in:
Sky020
2020-09-09 17:12:48 +01:00
committed by Ahmad Abdolsaheb
parent d765fa704b
commit c4240cdf2f
6 changed files with 37 additions and 28 deletions

View File

@@ -8,7 +8,10 @@ import Form from './Form';
const defaultTestProps = {
buttonText: 'Submit',
formFields: ['name', 'website'],
formFields: [
{ name: 'name', label: 'name Label' },
{ name: 'website', label: 'WebSite label' }
],
id: 'my-test-form',
options: {
types: {
@@ -23,11 +26,11 @@ const defaultTestProps = {
test('should render', () => {
const { getByLabelText, getByText } = render(<Form {...defaultTestProps} />);
const nameInput = getByLabelText(/name/i);
const nameInput = getByLabelText(/name Label/);
expect(nameInput).not.toBeRequired();
expect(nameInput).toHaveAttribute('type', 'text');
const websiteInput = getByLabelText(/website/i);
const websiteInput = getByLabelText(/WebSite label/);
expect(websiteInput).toBeRequired();
expect(websiteInput).toHaveAttribute('type', 'url');
@@ -48,10 +51,10 @@ test('should render with default values', () => {
/>
);
const nameInput = getByLabelText(/name/i);
const nameInput = getByLabelText(/name Label/);
expect(nameInput).toHaveValue(nameValue);
const websiteInput = getByLabelText(/website/i);
const websiteInput = getByLabelText(/WebSite label/);
expect(websiteInput).toHaveValue(websiteValue);
const button = getByText(/submit/i);
@@ -68,7 +71,7 @@ test('should submit', () => {
const { getByLabelText, getByText } = render(<Form {...props} />);
const websiteInput = getByLabelText(/website/i);
const websiteInput = getByLabelText(/WebSite label/);
fireEvent.change(websiteInput, { target: { value: websiteValue } });
expect(websiteInput).toHaveValue(websiteValue);