Merge pull request #11799 from influxdata/tests-adminui

Create tests for adminui tabs
pull/11806/head
Palakp41 2019-02-11 13:22:01 -08:00 committed by GitHub
commit 20c15ff09c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 1096 additions and 0 deletions

View File

@ -533,6 +533,37 @@ export const bucket = {
labels: [],
}
export const buckets = [
{
links: {
labels: '/api/v2/buckets/034a10d6f7a6b000/labels',
log: '/api/v2/buckets/034a10d6f7a6b000/log',
org: '/api/v2/orgs/034a0adc49a6b000',
self: '/api/v2/buckets/034a10d6f7a6b000',
},
id: '034a10d6f7a6b000',
organizationID: '034a0adc49a6b000',
organization: 'default',
name: 'newbuck',
retentionRules: [],
labels: [],
},
{
links: {
labels: '/api/v2/buckets/034a10d6f7a6b000/labels',
log: '/api/v2/buckets/034a10d6f7a6b000/log',
org: '/api/v2/orgs/034a0adc49a6b000',
self: '/api/v2/buckets/034a10d6f7a6b000',
},
id: '034a10d6f7a6b001',
organizationID: '034a0adc49a6b000',
organization: 'default',
name: 'newbuck1',
retentionRules: [],
labels: [],
},
]
export const setSetupParamsResponse = {
data: {
user: {
@ -642,3 +673,39 @@ export const setSetupParamsResponse = {
},
request: {},
}
export const telegraf = [
{
id: '03636a150fb51000',
name: 'Name this Configuration',
organizationID: '03636a0aabb51000',
},
{
id: '03636a150fb51001',
name: 'Name this Configuration',
organizationID: '03636a0aabb51000',
},
]
export const scraperTargets = [
{
bucket: 'a',
bucketID: '03636a0aabb51001',
id: '03636a0bfe351000',
name: 'new target',
orgID: '03636a0aabb51000',
organization: 'a',
type: 'prometheus',
url: 'http://localhost:9999/metrics',
},
{
bucket: 'a',
bucketID: '03636a0aabb51001',
id: '03636a0bfe351001',
name: 'new target',
orgID: '03636a0aabb51000',
organization: 'a',
type: 'prometheus',
url: 'http://localhost:9999/metrics',
},
]

View File

@ -0,0 +1,38 @@
// Libraries
import React from 'react'
import {renderWithRedux} from 'src/mockState'
// Components
import BucketList from 'src/organizations/components/BucketList'
// Constants
import {buckets} from 'mocks/dummyData'
import {DataLoaderType} from 'src/types/v2/dataLoaders'
import {withRouterProps} from 'mocks/dummyData'
const setup = (override?) => {
const props = {
...withRouterProps,
buckets,
emptyState: <></>,
onUpdateBucket: jest.fn(),
onDeleteBucket: jest.fn(),
onSetBucketInfo: jest.fn(),
onSetDataLoadersType: jest.fn(),
dataLoaderType: DataLoaderType.Streaming,
...override,
}
const wrapper = renderWithRedux(<BucketList {...props} />)
return {wrapper}
}
describe('BucketList', () => {
describe('rendering', () => {
it('renders', () => {
const {wrapper} = setup()
expect(wrapper).toMatchSnapshot()
})
})
})

View File

@ -0,0 +1,35 @@
// Libraries
import React from 'react'
import {shallow} from 'enzyme'
// Components
import CollectorList from 'src/organizations/components/CollectorList'
// Constants
import {telegraf} from 'mocks/dummyData'
const setup = (override?) => {
const props = {
collectors: telegraf,
emptyState: <></>,
onDelete: jest.fn(),
onUpdate: jest.fn(),
onOpenInstructions: jest.fn(),
onOpenTelegrafConfig: jest.fn(),
...override,
}
const wrapper = shallow(<CollectorList {...props} />)
return {wrapper}
}
describe('CollectorList', () => {
describe('rendering', () => {
it('renders', () => {
const {wrapper} = setup()
expect(wrapper.exists()).toBe(true)
expect(wrapper).toMatchSnapshot()
})
})
})

View File

@ -0,0 +1,31 @@
// Libraries
import React from 'react'
import {shallow} from 'enzyme'
// Components
import MemberList from 'src/organizations/components/MemberList'
// Constants
import {resouceOwner} from 'src/organizations/dummyData'
const setup = (override?) => {
const props = {
members: resouceOwner,
emptyState: <></>,
...override,
}
const wrapper = shallow(<MemberList {...props} />)
return {wrapper}
}
describe('MemberList', () => {
describe('rendering', () => {
it('renders', () => {
const {wrapper} = setup()
expect(wrapper.exists()).toBe(true)
expect(wrapper).toMatchSnapshot()
})
})
})

View File

@ -0,0 +1,33 @@
// Libraries
import React from 'react'
import {shallow} from 'enzyme'
// Components
import ScraperList from 'src/organizations/components/ScraperList'
// Constants
import {scraperTargets} from 'mocks/dummyData'
const setup = (override?) => {
const props = {
scrapers: scraperTargets,
emptyState: <></>,
onDeleteScraper: jest.fn(),
onUpdateScraper: jest.fn(),
...override,
}
const wrapper = shallow(<ScraperList {...props} />)
return {wrapper}
}
describe('ScraperList', () => {
describe('rendering', () => {
it('renders', () => {
const {wrapper} = setup()
expect(wrapper.exists()).toBe(true)
expect(wrapper).toMatchSnapshot()
})
})
})

View File

@ -0,0 +1,687 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`BucketList rendering renders 1`] = `
Object {
"asFragment": [Function],
"baseElement": <body>
<div>
<table
class="index-list"
>
<thead
class="index-list--header"
>
<tr>
<th
class="index-list--header-cell index-list--align-left"
style="width: 40%;"
>
Name
</th>
<th
class="index-list--header-cell index-list--align-left"
style="width: 40%;"
>
Retention
</th>
<th
class="index-list--header-cell index-list--align-left"
style="width: 20%;"
>
</th>
</tr>
</thead>
<tbody
class="index-list--body"
>
<tr
class="index-list--row"
>
<td
class="index-list--row-cell index-list--align-left"
>
<div
class="index-list--cell"
>
<div
class="editable-name"
>
<a
href="#"
>
<span>
newbuck
</span>
</a>
<div
class="editable-name--toggle"
>
<span
class="icon pencil"
/>
</div>
</div>
</div>
</td>
<td
class="index-list--row-cell index-list--align-left"
>
<div
class="index-list--cell"
/>
</td>
<td
class="index-list--row-cell index-list--show-hover index-list--align-right"
>
<div
class="index-list--cell"
>
<div
class="confirmation-button"
>
<button
class="button button-xs button-danger"
tabindex="0"
title="Delete"
type="button"
>
Delete
</button>
<div
class="confirmation-button--tooltip"
>
<div
class="confirmation-button--tooltip-body"
data-test="confirmation-button--click-target"
>
Confirm
</div>
</div>
</div>
</div>
</td>
<td
class="index-list--row-cell index-list--align-right"
>
<div
class="index-list--cell"
>
<div
class="context-menu"
>
<div
class="context-menu--container"
>
<button
class="button button-xs button-primary context-menu--toggle context-menu--primary"
tabindex="0"
title="Add Data"
type="button"
>
Add Data
</button>
<div
class="context-menu--list-container"
>
<div
class="context-menu--list context-menu--primary"
>
<button
class="context-menu--item"
>
Configure Telegraf Agent
<div
class="contex-menu--item-description"
>
Configure a Telegraf agent to push data into your bucket.
</div>
</button>
<button
class="context-menu--item"
>
Line Protocol
<div
class="contex-menu--item-description"
>
Quickly load an existing line protocol file.
</div>
</button>
<button
class="context-menu--item"
>
Scrape Metrics
<div
class="contex-menu--item-description"
>
Add a scrape target to pull data into your bucket.
</div>
</button>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr
class="index-list--row"
>
<td
class="index-list--row-cell index-list--align-left"
>
<div
class="index-list--cell"
>
<div
class="editable-name"
>
<a
href="#"
>
<span>
newbuck1
</span>
</a>
<div
class="editable-name--toggle"
>
<span
class="icon pencil"
/>
</div>
</div>
</div>
</td>
<td
class="index-list--row-cell index-list--align-left"
>
<div
class="index-list--cell"
/>
</td>
<td
class="index-list--row-cell index-list--show-hover index-list--align-right"
>
<div
class="index-list--cell"
>
<div
class="confirmation-button"
>
<button
class="button button-xs button-danger"
tabindex="0"
title="Delete"
type="button"
>
Delete
</button>
<div
class="confirmation-button--tooltip"
>
<div
class="confirmation-button--tooltip-body"
data-test="confirmation-button--click-target"
>
Confirm
</div>
</div>
</div>
</div>
</td>
<td
class="index-list--row-cell index-list--align-right"
>
<div
class="index-list--cell"
>
<div
class="context-menu"
>
<div
class="context-menu--container"
>
<button
class="button button-xs button-primary context-menu--toggle context-menu--primary"
tabindex="0"
title="Add Data"
type="button"
>
Add Data
</button>
<div
class="context-menu--list-container"
>
<div
class="context-menu--list context-menu--primary"
>
<button
class="context-menu--item"
>
Configure Telegraf Agent
<div
class="contex-menu--item-description"
>
Configure a Telegraf agent to push data into your bucket.
</div>
</button>
<button
class="context-menu--item"
>
Line Protocol
<div
class="contex-menu--item-description"
>
Quickly load an existing line protocol file.
</div>
</button>
<button
class="context-menu--item"
>
Scrape Metrics
<div
class="contex-menu--item-description"
>
Add a scrape target to pull data into your bucket.
</div>
</button>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<div
class="overlay-tech"
>
<div
class="overlay--dialog"
data-test="overlay-children"
/>
<div
class="overlay--mask"
/>
</div>
<div
class="overlay-tech"
>
<div
class="overlay--dialog"
data-test="overlay-children"
/>
<div
class="overlay--mask"
/>
</div>
</div>
</body>,
"container": <div>
<table
class="index-list"
>
<thead
class="index-list--header"
>
<tr>
<th
class="index-list--header-cell index-list--align-left"
style="width: 40%;"
>
Name
</th>
<th
class="index-list--header-cell index-list--align-left"
style="width: 40%;"
>
Retention
</th>
<th
class="index-list--header-cell index-list--align-left"
style="width: 20%;"
>
</th>
</tr>
</thead>
<tbody
class="index-list--body"
>
<tr
class="index-list--row"
>
<td
class="index-list--row-cell index-list--align-left"
>
<div
class="index-list--cell"
>
<div
class="editable-name"
>
<a
href="#"
>
<span>
newbuck
</span>
</a>
<div
class="editable-name--toggle"
>
<span
class="icon pencil"
/>
</div>
</div>
</div>
</td>
<td
class="index-list--row-cell index-list--align-left"
>
<div
class="index-list--cell"
/>
</td>
<td
class="index-list--row-cell index-list--show-hover index-list--align-right"
>
<div
class="index-list--cell"
>
<div
class="confirmation-button"
>
<button
class="button button-xs button-danger"
tabindex="0"
title="Delete"
type="button"
>
Delete
</button>
<div
class="confirmation-button--tooltip"
>
<div
class="confirmation-button--tooltip-body"
data-test="confirmation-button--click-target"
>
Confirm
</div>
</div>
</div>
</div>
</td>
<td
class="index-list--row-cell index-list--align-right"
>
<div
class="index-list--cell"
>
<div
class="context-menu"
>
<div
class="context-menu--container"
>
<button
class="button button-xs button-primary context-menu--toggle context-menu--primary"
tabindex="0"
title="Add Data"
type="button"
>
Add Data
</button>
<div
class="context-menu--list-container"
>
<div
class="context-menu--list context-menu--primary"
>
<button
class="context-menu--item"
>
Configure Telegraf Agent
<div
class="contex-menu--item-description"
>
Configure a Telegraf agent to push data into your bucket.
</div>
</button>
<button
class="context-menu--item"
>
Line Protocol
<div
class="contex-menu--item-description"
>
Quickly load an existing line protocol file.
</div>
</button>
<button
class="context-menu--item"
>
Scrape Metrics
<div
class="contex-menu--item-description"
>
Add a scrape target to pull data into your bucket.
</div>
</button>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr
class="index-list--row"
>
<td
class="index-list--row-cell index-list--align-left"
>
<div
class="index-list--cell"
>
<div
class="editable-name"
>
<a
href="#"
>
<span>
newbuck1
</span>
</a>
<div
class="editable-name--toggle"
>
<span
class="icon pencil"
/>
</div>
</div>
</div>
</td>
<td
class="index-list--row-cell index-list--align-left"
>
<div
class="index-list--cell"
/>
</td>
<td
class="index-list--row-cell index-list--show-hover index-list--align-right"
>
<div
class="index-list--cell"
>
<div
class="confirmation-button"
>
<button
class="button button-xs button-danger"
tabindex="0"
title="Delete"
type="button"
>
Delete
</button>
<div
class="confirmation-button--tooltip"
>
<div
class="confirmation-button--tooltip-body"
data-test="confirmation-button--click-target"
>
Confirm
</div>
</div>
</div>
</div>
</td>
<td
class="index-list--row-cell index-list--align-right"
>
<div
class="index-list--cell"
>
<div
class="context-menu"
>
<div
class="context-menu--container"
>
<button
class="button button-xs button-primary context-menu--toggle context-menu--primary"
tabindex="0"
title="Add Data"
type="button"
>
Add Data
</button>
<div
class="context-menu--list-container"
>
<div
class="context-menu--list context-menu--primary"
>
<button
class="context-menu--item"
>
Configure Telegraf Agent
<div
class="contex-menu--item-description"
>
Configure a Telegraf agent to push data into your bucket.
</div>
</button>
<button
class="context-menu--item"
>
Line Protocol
<div
class="contex-menu--item-description"
>
Quickly load an existing line protocol file.
</div>
</button>
<button
class="context-menu--item"
>
Scrape Metrics
<div
class="contex-menu--item-description"
>
Add a scrape target to pull data into your bucket.
</div>
</button>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<div
class="overlay-tech"
>
<div
class="overlay--dialog"
data-test="overlay-children"
/>
<div
class="overlay--mask"
/>
</div>
<div
class="overlay-tech"
>
<div
class="overlay--dialog"
data-test="overlay-children"
/>
<div
class="overlay--mask"
/>
</div>
</div>,
"debug": [Function],
"getAllByAltText": [Function],
"getAllByDisplayValue": [Function],
"getAllByLabelText": [Function],
"getAllByPlaceholderText": [Function],
"getAllByRole": [Function],
"getAllBySelectText": [Function],
"getAllByTestId": [Function],
"getAllByText": [Function],
"getAllByTitle": [Function],
"getAllByValue": [Function],
"getByAltText": [Function],
"getByDisplayValue": [Function],
"getByLabelText": [Function],
"getByPlaceholderText": [Function],
"getByRole": [Function],
"getBySelectText": [Function],
"getByTestId": [Function],
"getByText": [Function],
"getByTitle": [Function],
"getByValue": [Function],
"queryAllByAltText": [Function],
"queryAllByDisplayValue": [Function],
"queryAllByLabelText": [Function],
"queryAllByPlaceholderText": [Function],
"queryAllByRole": [Function],
"queryAllBySelectText": [Function],
"queryAllByTestId": [Function],
"queryAllByText": [Function],
"queryAllByTitle": [Function],
"queryAllByValue": [Function],
"queryByAltText": [Function],
"queryByDisplayValue": [Function],
"queryByLabelText": [Function],
"queryByPlaceholderText": [Function],
"queryByRole": [Function],
"queryBySelectText": [Function],
"queryByTestId": [Function],
"queryByText": [Function],
"queryByTitle": [Function],
"queryByValue": [Function],
"rerender": [Function],
"store": Object {
"dispatch": [Function],
"getState": [Function],
"replaceReducer": [Function],
"subscribe": [Function],
Symbol(observable): [Function],
},
"unmount": [Function],
}
`;

View File

@ -0,0 +1,55 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`CollectorList rendering renders 1`] = `
<Fragment>
<IndexList>
<IndexListHeader>
<IndexListHeaderCell
alignment="left"
columnName="Name"
width="50%"
/>
<IndexListHeaderCell
alignment="left"
columnName="Bucket"
width="50%"
/>
</IndexListHeader>
<IndexListBody
columnCount={3}
emptyState={<React.Fragment />}
>
<CollectorRow
bucket=""
collector={
Object {
"id": "03636a150fb51000",
"name": "Name this Configuration",
"organizationID": "03636a0aabb51000",
}
}
key="03636a150fb51000"
onDelete={[MockFunction]}
onOpenInstructions={[MockFunction]}
onOpenTelegrafConfig={[MockFunction]}
onUpdate={[MockFunction]}
/>
<CollectorRow
bucket=""
collector={
Object {
"id": "03636a150fb51001",
"name": "Name this Configuration",
"organizationID": "03636a0aabb51000",
}
}
key="03636a150fb51001"
onDelete={[MockFunction]}
onOpenInstructions={[MockFunction]}
onOpenTelegrafConfig={[MockFunction]}
onUpdate={[MockFunction]}
/>
</IndexListBody>
</IndexList>
</Fragment>
`;

View File

@ -0,0 +1,91 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`MemberList rendering renders 1`] = `
<IndexList>
<IndexListHeader>
<IndexListHeaderCell
alignment="left"
columnName="Username"
width="25%"
/>
<IndexListHeaderCell
alignment="left"
columnName="Role"
width="25%"
/>
<IndexListHeaderCell
alignment="left"
columnName=""
width="50%"
/>
</IndexListHeader>
<IndexListBody
columnCount={3}
emptyState={<React.Fragment />}
>
<IndexListRow
disabled={false}
key="1"
>
<IndexListRowCell
alignment="left"
revealOnHover={false}
>
John
</IndexListRowCell>
<IndexListRowCell
alignment="left"
revealOnHover={false}
>
owner
</IndexListRowCell>
<IndexListRowCell
alignment="left"
revealOnHover={false}
/>
</IndexListRow>
<IndexListRow
disabled={false}
key="2"
>
<IndexListRowCell
alignment="left"
revealOnHover={false}
>
Jane
</IndexListRowCell>
<IndexListRowCell
alignment="left"
revealOnHover={false}
>
owner
</IndexListRowCell>
<IndexListRowCell
alignment="left"
revealOnHover={false}
/>
</IndexListRow>
<IndexListRow
disabled={false}
key="3"
>
<IndexListRowCell
alignment="left"
revealOnHover={false}
>
Smith
</IndexListRowCell>
<IndexListRowCell
alignment="left"
revealOnHover={false}
>
owner
</IndexListRowCell>
<IndexListRowCell
alignment="left"
revealOnHover={false}
/>
</IndexListRow>
</IndexListBody>
</IndexList>
`;

View File

@ -0,0 +1,59 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`ScraperList rendering renders 1`] = `
<Fragment>
<IndexList>
<IndexListHeader>
<IndexListHeaderCell
alignment="left"
columnName="URL"
width="50%"
/>
<IndexListHeaderCell
alignment="left"
columnName="Bucket"
width="50%"
/>
</IndexListHeader>
<IndexListBody
columnCount={3}
emptyState={<React.Fragment />}
>
<ScraperRow
key="03636a0bfe351000"
onDeleteScraper={[MockFunction]}
onUpdateScraper={[MockFunction]}
scraper={
Object {
"bucket": "a",
"bucketID": "03636a0aabb51001",
"id": "03636a0bfe351000",
"name": "new target",
"orgID": "03636a0aabb51000",
"organization": "a",
"type": "prometheus",
"url": "http://localhost:9999/metrics",
}
}
/>
<ScraperRow
key="03636a0bfe351001"
onDeleteScraper={[MockFunction]}
onUpdateScraper={[MockFunction]}
scraper={
Object {
"bucket": "a",
"bucketID": "03636a0aabb51001",
"id": "03636a0bfe351001",
"name": "new target",
"orgID": "03636a0aabb51000",
"organization": "a",
"type": "prometheus",
"url": "http://localhost:9999/metrics",
}
}
/>
</IndexListBody>
</IndexList>
</Fragment>
`;