chore: added tests for the rest of the broken out components. Now I think we're ready to go...

Signed-off-by: blam <ben@blam.sh>

plugins/scaffolder/src/components/fields/RepoUrlPicker/AzureRepoPicker.test.tsx

@@ -0,0 +1,76 @@
+/*
+ * Copyright 2022 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import { AzureRepoPicker } from './AzureRepoPicker';
+import { render, fireEvent } from '@testing-library/react';
+
+describe('AzureRepoPicker', () => {
+  it('renders the three input fields', async () => {
+    const { getAllByRole } = render(
+      <AzureRepoPicker onChange={jest.fn()} rawErrors={[]} state={{}} />,
+    );
+
+    const allInputs = getAllByRole('textbox');
+
+    expect(allInputs).toHaveLength(3);
+  });
+
+  describe('org field', () => {
+    it('calls onChange when the organisation changes', () => {
+      const onChange = jest.fn();
+      const { getAllByRole } = render(
+        <AzureRepoPicker onChange={onChange} rawErrors={[]} state={{}} />,
+      );
+
+      const orgInput = getAllByRole('textbox')[0];
+
+      fireEvent.change(orgInput, { target: { value: 'org' } });
+
+      expect(onChange).toHaveBeenCalledWith({ organization: 'org' });
+    });
+  });
+
+  describe('owner field', () => {
+    it('calls onChange when the owner changes', () => {
+      const onChange = jest.fn();
+      const { getAllByRole } = render(
+        <AzureRepoPicker onChange={onChange} rawErrors={[]} state={{}} />,
+      );
+
+      const ownerInput = getAllByRole('textbox')[1];
+
+      fireEvent.change(ownerInput, { target: { value: 'owner' } });
+
+      expect(onChange).toHaveBeenCalledWith({ owner: 'owner' });
+    });
+  });
+
+  describe('repoName field', () => {
+    it('calls onChange when the repoName changes', () => {
+      const onChange = jest.fn();
+      const { getAllByRole } = render(
+        <AzureRepoPicker onChange={onChange} rawErrors={[]} state={{}} />,
+      );
+
+      const repoNameInput = getAllByRole('textbox')[2];
+
+      fireEvent.change(repoNameInput, { target: { value: 'repoName' } });
+
+      expect(onChange).toHaveBeenCalledWith({ repoName: 'repoName' });
+    });
+  });
+});

plugins/scaffolder/src/components/fields/RepoUrlPicker/AzureRepoPicker.tsx

@@ -66,9 +66,9 @@ export const AzureRepoPicker = ({
         required
         error={rawErrors?.length > 0 && !repoName}
       >
-        <InputLabel htmlFor="repoInput">Repository</InputLabel>
+        <InputLabel htmlFor="repoNameInput">Repository</InputLabel>
         <Input
-          id="repoInput"
+          id="repoNameInput"
           onChange={e => onChange({ repoName: e.target.value })}
           value={repoName}
         />

plugins/scaffolder/src/components/fields/RepoUrlPicker/BitbucketRepoPicker.test.tsx

@@ -0,0 +1,100 @@
+/*
+ * Copyright 2022 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import { BitbucketRepoPicker } from './BitbucketRepoPicker';
+import { render, fireEvent } from '@testing-library/react';
+
+describe('BitbucketRepoPicker', () => {
+  it('renders workspace input when host is bitbucket.org', () => {
+    const state = { host: 'bitbucket.org', workspace: 'lolsWorkspace' };
+
+    const { getAllByRole } = render(
+      <BitbucketRepoPicker onChange={jest.fn()} rawErrors={[]} state={state} />,
+    );
+
+    expect(getAllByRole('textbox')).toHaveLength(3);
+    expect(getAllByRole('textbox')[0]).toHaveValue('lolsWorkspace');
+  });
+
+  it('hides the workspace input when the host is not bitbucket.org', () => {
+    const state = {
+      host: 'mycustom.domain.bitbucket.org',
+    };
+
+    const { getAllByRole } = render(
+      <BitbucketRepoPicker onChange={jest.fn()} rawErrors={[]} state={state} />,
+    );
+
+    expect(getAllByRole('textbox')).toHaveLength(2);
+  });
+  describe('workspace field', () => {
+    it('calls onChange when the workspace changes', () => {
+      const onChange = jest.fn();
+      const { getAllByRole } = render(
+        <BitbucketRepoPicker
+          onChange={onChange}
+          rawErrors={[]}
+          state={{ host: 'bitbucket.org' }}
+        />,
+      );
+
+      const workspaceInput = getAllByRole('textbox')[0];
+
+      fireEvent.change(workspaceInput, { target: { value: 'test-workspace' } });
+
+      expect(onChange).toHaveBeenCalledWith({ workspace: 'test-workspace' });
+    });
+  });
+
+  describe('project field', () => {
+    it('calls onChange when the project changes', () => {
+      const onChange = jest.fn();
+      const { getAllByRole } = render(
+        <BitbucketRepoPicker
+          onChange={onChange}
+          rawErrors={[]}
+          state={{ host: 'bitbucket.org' }}
+        />,
+      );
+
+      const projectInput = getAllByRole('textbox')[1];
+
+      fireEvent.change(projectInput, { target: { value: 'test-project' } });
+
+      expect(onChange).toHaveBeenCalledWith({ project: 'test-project' });
+    });
+  });
+
+  describe('repoName field', () => {
+    it('calls onChange when the repoName changes', () => {
+      const onChange = jest.fn();
+      const { getAllByRole } = render(
+        <BitbucketRepoPicker
+          onChange={onChange}
+          rawErrors={[]}
+          state={{ host: 'bitbucket.org' }}
+        />,
+      );
+
+      const repoNameInput = getAllByRole('textbox')[2];
+
+      fireEvent.change(repoNameInput, { target: { value: 'test-repo' } });
+
+      expect(onChange).toHaveBeenCalledWith({ repoName: 'test-repo' });
+    });
+  });
+});

plugins/scaffolder/src/components/fields/RepoUrlPicker/BitbucketRepoPicker.tsx

@@ -69,9 +69,9 @@ export const BitbucketRepoPicker = ({
         required
         error={rawErrors?.length > 0 && !repoName}
       >
-        <InputLabel htmlFor="repoInput">Repository</InputLabel>
+        <InputLabel htmlFor="repoNameInput">Repository</InputLabel>
         <Input
-          id="repoInput"
+          id="repoNameInput"
           onChange={e => onChange({ repoName: e.target.value })}
           value={repoName}
         />

plugins/scaffolder/src/components/fields/RepoUrlPicker/GithubRepoPicker.test.tsx

@@ -18,7 +18,7 @@ import React from 'react';
 import { GithubRepoPicker } from './GithubRepoPicker';
 import { render, fireEvent } from '@testing-library/react';
 
-describe('GitubRepoPicker', () => {
+describe('GithubRepoPicker', () => {
   describe('owner field', () => {
     it('renders a select if there is a list of allowed owners', async () => {
       const allowedOwners = ['owner1', 'owner2'];

plugins/scaffolder/src/components/fields/RepoUrlPicker/GithubRepoPicker.tsx

@@ -75,9 +75,9 @@ export const GithubRepoPicker = ({
         required
         error={rawErrors?.length > 0 && !repoName}
       >
-        <InputLabel htmlFor="repoInput">Repository</InputLabel>
+        <InputLabel htmlFor="repoNameInput">Repository</InputLabel>
         <Input
-          id="repoInput"
+          id="repoNameInput"
           onChange={e => onChange({ repoName: e.target.value })}
           value={repoName}
         />

plugins/scaffolder/src/components/fields/RepoUrlPicker/GitlabRepoPicker.test.tsx

@@ -0,0 +1,107 @@
+/*
+ * Copyright 2022 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import { GitlabRepoPicker } from './GitlabRepoPicker';
+import { render, fireEvent } from '@testing-library/react';
+
+describe('GitlabRepoPicker', () => {
+  describe('owner field', () => {
+    it('renders a select if there is a list of allowed owners', async () => {
+      const allowedOwners = ['owner1', 'owner2'];
+      const { findByText } = render(
+        <GitlabRepoPicker
+          onChange={jest.fn()}
+          rawErrors={[]}
+          state={{ repoName: 'repo' }}
+          allowedOwners={allowedOwners}
+        />,
+      );
+
+      expect(await findByText('owner1')).toBeInTheDocument();
+      expect(await findByText('owner2')).toBeInTheDocument();
+    });
+
+    it('calls onChange when the owner is changed to a different owner', async () => {
+      const onChange = jest.fn();
+      const allowedOwners = ['owner1', 'owner2'];
+      const { getByRole } = render(
+        <GitlabRepoPicker
+          onChange={onChange}
+          rawErrors={[]}
+          state={{ repoName: 'repo' }}
+          allowedOwners={allowedOwners}
+        />,
+      );
+
+      await fireEvent.change(getByRole('combobox'), {
+        target: { value: 'owner2' },
+      });
+
+      expect(onChange).toHaveBeenCalledWith({ owner: 'owner2' });
+    });
+
+    it('is disabled picked when only one allowed owner', () => {
+      const onChange = jest.fn();
+      const allowedOwners = ['owner1'];
+      const { getByRole } = render(
+        <GitlabRepoPicker
+          onChange={onChange}
+          rawErrors={[]}
+          state={{ repoName: 'repo' }}
+          allowedOwners={allowedOwners}
+        />,
+      );
+
+      expect(getByRole('combobox')).toBeDisabled();
+    });
+
+    it('should display free text if no allowed owners are passed', async () => {
+      const onChange = jest.fn();
+      const { getAllByRole } = render(
+        <GitlabRepoPicker
+          onChange={onChange}
+          rawErrors={[]}
+          state={{ repoName: 'repo' }}
+        />,
+      );
+      const ownerField = getAllByRole('textbox')[0];
+      fireEvent.change(ownerField, { target: { value: 'my-mock-owner' } });
+
+      expect(onChange).toHaveBeenCalledWith({ owner: 'my-mock-owner' });
+    });
+  });
+
+  describe('repo name', () => {
+    it('should render free text field for input of repo name', () => {
+      const onChange = jest.fn();
+      const { getAllByRole } = render(
+        <GitlabRepoPicker
+          onChange={onChange}
+          rawErrors={[]}
+          state={{ repoName: 'repo' }}
+        />,
+      );
+
+      const repoNameField = getAllByRole('textbox')[1];
+      fireEvent.change(repoNameField, {
+        target: { value: 'my-mock-repo-name' },
+      });
+
+      expect(onChange).toHaveBeenCalledWith({ repoName: 'my-mock-repo-name' });
+    });
+  });
+});

plugins/scaffolder/src/components/fields/RepoUrlPicker/GitlabRepoPicker.tsx

@@ -77,9 +77,9 @@ export const GitlabRepoPicker = ({
         required
         error={rawErrors?.length > 0 && !repoName}
       >
-        <InputLabel htmlFor="repoInput">Repository</InputLabel>
+        <InputLabel htmlFor="repoNameInput">Repository</InputLabel>
         <Input
-          id="repoInput"
+          id="repoNameInput"
           onChange={e => onChange({ repoName: e.target.value })}
           value={repoName}
         />