Create initial App/Search tests and related data

src/components/App.tsx

@@ -8,7 +8,7 @@ import { Search } from './Search';
 import { Results } from './Results';
 import { Artists, Artist } from '../interfaces';
 
-const QUERY_ARTISTS = gql`
+export const QUERY_ARTISTS = gql`
 	query Artist($byName: String!) {
 		queryArtists(byName: $byName) {
 			name

src/components/Search.tsx

@@ -19,13 +19,10 @@ export const Search = ({
 		justify='center'
 		margin={{ top: 'large' }}
 	>
-		<Box
-			as='div'
-			margin={{ vertical: 'none' }}
-			width='500px'
-
-		>
+		<Box as='div' margin={{ vertical: 'none' }} width='500px'>
 			<TextInput
+				type='search'
+				name='q'
 				value={inputValue}
 				suggestions={suggestions}
 				onChange={(e) => handleChange(e.target.value)}
@@ -33,7 +30,9 @@ export const Search = ({
 				icon={<FormSearch color='plain' />}
 				dropHeight='large'
 				placeholder='Type an artist name'
+				autoFocus
+				aria-label='Search by artist name'
 			/>
 		</Box>
 	</Box>
-);
+);