[tests][m]: more tests for Search components.
This commit is contained in:
anuveyatsu
parent
2ecd88388a
commit
ec646f1f10
18
__tests__/components/search/Input.test.tsx
Normal file
18
__tests__/components/search/Input.test.tsx
Normal file
@ -0,0 +1,18 @@
|
||||
import React from 'react'
|
||||
import { render } from '@testing-library/react'
|
||||
import renderer from 'react-test-renderer'
|
||||
import Input from '../../../components/search/Input'
|
||||
|
||||
test('📸 of Input component with empty', () => {
|
||||
const query = {}
|
||||
const tree = renderer.create(<Input query={query} />).toJSON()
|
||||
expect(tree).toMatchSnapshot()
|
||||
})
|
||||
|
||||
test('📸 of Input component with query', () => {
|
||||
const query = {
|
||||
q: 'gdp'
|
||||
}
|
||||
const tree = renderer.create(<Input query={query} />).toJSON()
|
||||
expect(tree).toMatchSnapshot()
|
||||
})
|
||||
@ -1,18 +0,0 @@
|
||||
import React from 'react'
|
||||
import { render } from '@testing-library/react'
|
||||
import renderer from 'react-test-renderer'
|
||||
import Item from '../../../components/search/Item'
|
||||
|
||||
test('📸 of Item component', () => {
|
||||
const datapackage = {
|
||||
name: 'test',
|
||||
title: 'Title',
|
||||
description: 'A description.',
|
||||
organization: {
|
||||
title: 'test org',
|
||||
name: 'test-org'
|
||||
}
|
||||
}
|
||||
const tree = renderer.create(<Item datapackage={datapackage} />).toJSON()
|
||||
expect(tree).toMatchSnapshot()
|
||||
})
|
||||
20
__tests__/components/search/List.test.tsx
Normal file
20
__tests__/components/search/List.test.tsx
Normal file
@ -0,0 +1,20 @@
|
||||
import React from 'react'
|
||||
import { render } from '@testing-library/react'
|
||||
import renderer from 'react-test-renderer'
|
||||
import List from '../../../components/search/List'
|
||||
|
||||
test('📸 of Input component with empty', () => {
|
||||
const datapackages = [
|
||||
{
|
||||
name: 'test',
|
||||
title: 'Title',
|
||||
description: 'A description.',
|
||||
organization: {
|
||||
title: 'test org',
|
||||
name: 'test-org'
|
||||
}
|
||||
}
|
||||
]
|
||||
const tree = renderer.create(<List datapackages={datapackages} />).toJSON()
|
||||
expect(tree).toMatchSnapshot()
|
||||
})
|
||||
9
__tests__/components/search/Sort.test.tsx
Normal file
9
__tests__/components/search/Sort.test.tsx
Normal file
@ -0,0 +1,9 @@
|
||||
import React from 'react'
|
||||
import { render } from '@testing-library/react'
|
||||
import renderer from 'react-test-renderer'
|
||||
import Sort from '../../../components/search/Sort'
|
||||
|
||||
test('📸 of Input component with empty', () => {
|
||||
const tree = renderer.create(<Sort />).toJSON()
|
||||
expect(tree).toMatchSnapshot()
|
||||
})
|
||||
@ -0,0 +1,46 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`📸 of Input component with empty 1`] = `
|
||||
<form
|
||||
className="flex items-center"
|
||||
onSubmit={[Function]}
|
||||
>
|
||||
<input
|
||||
aria-label="Search"
|
||||
className="bg-white focus:outline-none focus:shadow-outline border border-gray-300 w-1/2 rounded-lg py-2 px-4 block appearance-none leading-normal"
|
||||
name="q"
|
||||
onChange={[Function]}
|
||||
placeholder="Search"
|
||||
type="text"
|
||||
/>
|
||||
<button
|
||||
className="inline-block text-sm px-4 py-3 mx-3 leading-none border rounded text-white bg-black border-black lg:mt-0"
|
||||
onClick={[Function]}
|
||||
>
|
||||
Search
|
||||
</button>
|
||||
</form>
|
||||
`;
|
||||
|
||||
exports[`📸 of Input component with query 1`] = `
|
||||
<form
|
||||
className="flex items-center"
|
||||
onSubmit={[Function]}
|
||||
>
|
||||
<input
|
||||
aria-label="Search"
|
||||
className="bg-white focus:outline-none focus:shadow-outline border border-gray-300 w-1/2 rounded-lg py-2 px-4 block appearance-none leading-normal"
|
||||
name="q"
|
||||
onChange={[Function]}
|
||||
placeholder="Search"
|
||||
type="text"
|
||||
value="gdp"
|
||||
/>
|
||||
<button
|
||||
className="inline-block text-sm px-4 py-3 mx-3 leading-none border rounded text-white bg-black border-black lg:mt-0"
|
||||
onClick={[Function]}
|
||||
>
|
||||
Search
|
||||
</button>
|
||||
</form>
|
||||
`;
|
||||
@ -1,33 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`📸 of Item component 1`] = `
|
||||
<div
|
||||
className="mb-6"
|
||||
>
|
||||
<h3
|
||||
className="text-xl font-semibold"
|
||||
>
|
||||
<a
|
||||
className="text-primary"
|
||||
href="/@test-org/test"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
Title
|
||||
</a>
|
||||
</h3>
|
||||
<a
|
||||
className="text-gray-500 block mt-1"
|
||||
href="/@test-org"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
test org
|
||||
</a>
|
||||
<div
|
||||
className="leading-relaxed mt-2"
|
||||
>
|
||||
A description.
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
35
__tests__/components/search/__snapshots__/List.test.tsx.snap
Normal file
35
__tests__/components/search/__snapshots__/List.test.tsx.snap
Normal file
@ -0,0 +1,35 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`📸 of Input component with empty 1`] = `
|
||||
<ul>
|
||||
<div
|
||||
className="mb-6"
|
||||
>
|
||||
<h3
|
||||
className="text-xl font-semibold"
|
||||
>
|
||||
<a
|
||||
className="text-primary"
|
||||
href="/@test-org/test"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
Title
|
||||
</a>
|
||||
</h3>
|
||||
<a
|
||||
className="text-gray-500 block mt-1"
|
||||
href="/@test-org"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
test org
|
||||
</a>
|
||||
<div
|
||||
className="leading-relaxed mt-2"
|
||||
>
|
||||
A description.
|
||||
</div>
|
||||
</div>
|
||||
</ul>
|
||||
`;
|
||||
44
__tests__/components/search/__snapshots__/Sort.test.tsx.snap
Normal file
44
__tests__/components/search/__snapshots__/Sort.test.tsx.snap
Normal file
@ -0,0 +1,44 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`📸 of Input component with empty 1`] = `
|
||||
<div
|
||||
className="inline-block my-6 float-right"
|
||||
>
|
||||
<label
|
||||
htmlFor="field-order-by"
|
||||
>
|
||||
Order by:
|
||||
</label>
|
||||
<select
|
||||
className="bg-white"
|
||||
id="field-order-by"
|
||||
name="sort"
|
||||
>
|
||||
<option
|
||||
value="score:desc"
|
||||
>
|
||||
Relevance
|
||||
</option>
|
||||
<option
|
||||
value="title_string:asc"
|
||||
>
|
||||
Name Ascending
|
||||
</option>
|
||||
<option
|
||||
value="title_string:desc"
|
||||
>
|
||||
Name Descending
|
||||
</option>
|
||||
<option
|
||||
value="metadata_modified:desc"
|
||||
>
|
||||
Last Modified
|
||||
</option>
|
||||
<option
|
||||
value="views_recent:desc"
|
||||
>
|
||||
Popular
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
`;
|
||||
@ -1,24 +1,27 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`📸 of Home page 1`] = `
|
||||
Array [
|
||||
<div
|
||||
className="container mx-auto"
|
||||
>
|
||||
<nav
|
||||
className="flex items-center justify-between flex-wrap bg-white p-6"
|
||||
className="flex items-center justify-between flex-wrap bg-white p-4 border-b border-gray-200"
|
||||
>
|
||||
<div
|
||||
className="flex items-center flex-shrink-0 text-gray-700 mr-6"
|
||||
>
|
||||
<span
|
||||
className="font-semibold text-xl tracking-tight"
|
||||
>
|
||||
Portal
|
||||
</span>
|
||||
<img
|
||||
alt="portal logo"
|
||||
src="/images/logo.svg"
|
||||
width="40"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
className="block lg:hidden"
|
||||
className="block lg:hidden mx-4"
|
||||
>
|
||||
<button
|
||||
className="flex items-center px-3 py-2 border rounded text-gray-700 border-teal-400 hover:text-black hover:border-black"
|
||||
className="flex items-center px-3 py-2 border rounded text-gray-700 border-orange-400 hover:text-black hover:border-black"
|
||||
onClick={[Function]}
|
||||
>
|
||||
<svg
|
||||
className="fill-current h-3 w-3"
|
||||
@ -35,55 +38,41 @@ Array [
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
className="w-full block flex-grow lg:flex lg:items-center lg:w-auto"
|
||||
className="hidden lg:block"
|
||||
>
|
||||
<div
|
||||
className="text-sm lg:flex-grow"
|
||||
<a
|
||||
className="block mt-4 lg:inline-block lg:mt-0 text-gray-700 hover:text-black mr-6"
|
||||
href="/search"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
<a
|
||||
className="block mt-4 lg:inline-block lg:mt-0 text-gray-700 hover:text-black mr-4"
|
||||
href="/search"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
Search
|
||||
</a>
|
||||
<a
|
||||
className="block mt-4 lg:inline-block lg:mt-0 text-gray-700 hover:text-black mr-4"
|
||||
href="http://tech.datopian.com/frontend/"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
target="_blank"
|
||||
>
|
||||
Docs
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<a
|
||||
className="inline-block text-sm px-4 py-2 leading-none border rounded text-black border-black hover:border-gray-700 hover:text-gray-700 hover:bg-white mt-4 lg:mt-0"
|
||||
href="https://github.com/datopian/portal"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
Code
|
||||
</a>
|
||||
</div>
|
||||
Search
|
||||
</a>
|
||||
<a
|
||||
className="block mt-4 lg:inline-block lg:mt-0 text-gray-700 hover:text-black mr-6"
|
||||
href="http://tech.datopian.com/frontend/"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
target="_blank"
|
||||
>
|
||||
Docs
|
||||
</a>
|
||||
<a
|
||||
className="inline-block text-sm px-4 py-2 leading-none border rounded text-white bg-black border-black hover:border-gray-700 hover:text-gray-700 hover:bg-white mt-4 lg:mt-0"
|
||||
href="https://github.com/datopian/portal"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
</nav>,
|
||||
</nav>
|
||||
<section
|
||||
className="flex mt-10 ml-40 justify-center"
|
||||
className="flex justify-center items-center flex-col mt-8 mx-4 lg:flex-row"
|
||||
>
|
||||
<div>
|
||||
<img
|
||||
src="/banner.png"
|
||||
width="500"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
className="mx-32"
|
||||
>
|
||||
<h1
|
||||
className="text-4xl font-thin"
|
||||
className="text-4xl mb-3 font-thin"
|
||||
>
|
||||
Find, Share and Publish
|
||||
<br />
|
||||
@ -95,23 +84,126 @@ Array [
|
||||
</span>
|
||||
</h1>
|
||||
<p
|
||||
className="text-md font-light w-4/5"
|
||||
className="text-md font-light mb-3 w-4/5"
|
||||
>
|
||||
At Datahub, we have over thousands of datasets for free and a Premium Data Service for additional or customised data with guaranteed updates.
|
||||
</p>
|
||||
<form
|
||||
className="flex items-center"
|
||||
onSubmit={[Function]}
|
||||
>
|
||||
<input
|
||||
aria-label="Search"
|
||||
className="bg-white focus:outline-none focus:shadow-outline border border-gray-300 rounded-lg py-2 px-4 block w-full appearance-none leading-normal"
|
||||
className="bg-white focus:outline-none focus:shadow-outline border border-gray-300 w-1/2 rounded-lg py-2 px-4 block appearance-none leading-normal"
|
||||
name="q"
|
||||
onChange={[Function]}
|
||||
placeholder="Search"
|
||||
type="text"
|
||||
/>
|
||||
<button
|
||||
className="inline-block text-sm px-4 py-3 mx-3 leading-none border rounded text-white bg-black border-black lg:mt-0"
|
||||
onClick={[Function]}
|
||||
>
|
||||
Search
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</section>,
|
||||
]
|
||||
<div
|
||||
className="mt-4"
|
||||
>
|
||||
<img
|
||||
className="w-4/5"
|
||||
src="/images/banner.svg"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
<section
|
||||
className="my-10 mx-4 lg:my-20"
|
||||
>
|
||||
<h1
|
||||
className="text-2xl font-thin mb-4"
|
||||
>
|
||||
Recent Datasets
|
||||
</h1>
|
||||
<div
|
||||
className="flex flex-col lg:flex-row"
|
||||
>
|
||||
<div
|
||||
className="border px-4 mb-4 mr-3 border-gray-100 w-5/6 shadow-sm"
|
||||
>
|
||||
<h1
|
||||
className="text-2xl font-thin"
|
||||
>
|
||||
Our World in Data - COVID 19
|
||||
</h1>
|
||||
<p
|
||||
className="text-gray-500"
|
||||
>
|
||||
Dataset
|
||||
</p>
|
||||
<p>
|
||||
data collected and managed by Our World in Data - COVID 19 pulled from GitHub on 06/10/2020 https://ourworldindata.org/coronavirus
|
||||
</p>
|
||||
<a
|
||||
className="pt-3 flex justify-end text-orange-500"
|
||||
href="/"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
View Dataset
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
className="border px-4 mb-4 mr-3 border-gray-100 w-5/6 shadow-sm"
|
||||
>
|
||||
<h1
|
||||
className="text-2xl font-thin"
|
||||
>
|
||||
Our World in Data - COVID 19
|
||||
</h1>
|
||||
<p
|
||||
className="text-gray-500"
|
||||
>
|
||||
Dataset
|
||||
</p>
|
||||
<p>
|
||||
data collected and managed by Our World in Data - COVID 19 pulled from GitHub on 06/10/2020 https://ourworldindata.org/coronavirus
|
||||
</p>
|
||||
<a
|
||||
className="pt-3 flex justify-end text-orange-500"
|
||||
href="/"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
View Dataset
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
className="border px-4 mb-4 border-gray-100 w-5/6 shadow-sm"
|
||||
>
|
||||
<h1
|
||||
className="text-2xl font-thin"
|
||||
>
|
||||
Our World in Data - COVID 19
|
||||
</h1>
|
||||
<p
|
||||
className="text-gray-500 mb-2"
|
||||
>
|
||||
Dataset
|
||||
</p>
|
||||
<p>
|
||||
data collected and managed by Our World in Data - COVID 19 pulled from GitHub on 06/10/2020 https://ourworldindata.org/coronavirus
|
||||
</p>
|
||||
<a
|
||||
className="pt-3 flex justify-end text-orange-500"
|
||||
href="/"
|
||||
onClick={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
>
|
||||
View Dataset
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
`;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user