chore: Moves spec files to the src folder - iteration 2 (#14201)

This commit is contained in:
Michael S. Molina
2021-04-23 19:18:46 -04:00
committed by GitHub
parent 98b450aa76
commit 1bc73f2cba
10 changed files with 0 additions and 0 deletions

View File

@@ -1,184 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 fetchMock from 'fetch-mock';
import React from 'react';
import configureStore from 'redux-mock-store';
import { Provider } from 'react-redux';
import thunk from 'redux-thunk';
import { styledMount as mount } from 'spec/helpers/theming';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { Switch } from 'src/components/Switch';
import ListView from 'src/components/ListView';
import SubMenu from 'src/components/Menu/SubMenu';
import AlertList from 'src/views/CRUD/alert/AlertList';
import IndeterminateCheckbox from 'src/components/IndeterminateCheckbox';
import { act } from 'react-dom/test-utils';
// store needed for withToasts(AlertList)
const mockStore = configureStore([thunk]);
const store = mockStore({});
const alertsEndpoint = 'glob:*/api/v1/report/?*';
const alertEndpoint = 'glob:*/api/v1/report/*';
const alertsInfoEndpoint = 'glob:*/api/v1/report/_info*';
const alertsCreatedByEndpoint = 'glob:*/api/v1/report/related/created_by*';
const mockalerts = [...new Array(3)].map((_, i) => ({
active: true,
changed_by: {
first_name: `user ${i}`,
id: i,
},
changed_on_delta_humanized: `${i} day(s) ago`,
created_by: {
first_name: `user ${i}`,
id: i,
},
created_on: new Date().toISOString,
id: i,
last_eval_dttm: Date.now(),
last_state: 'ok',
name: `alert ${i} `,
owners: [],
recipients: [
{
id: `${i}`,
type: 'email',
},
],
type: 'alert',
}));
const mockUser = {
userId: 1,
};
fetchMock.get(alertsEndpoint, {
ids: [2, 0, 1],
result: mockalerts,
count: 3,
});
fetchMock.get(alertsInfoEndpoint, {
permissions: ['can_write'],
});
fetchMock.get(alertsCreatedByEndpoint, { result: [] });
fetchMock.put(alertEndpoint, { ...mockalerts[0], active: false });
fetchMock.put(alertsEndpoint, { ...mockalerts[0], active: false });
fetchMock.delete(alertEndpoint, {});
fetchMock.delete(alertsEndpoint, {});
async function mountAndWait(props = {}) {
const mounted = mount(
<Provider store={store}>
<AlertList store={store} user={mockUser} {...props} />
</Provider>,
);
await waitForComponentToPaint(mounted);
return mounted;
}
describe('AlertList', () => {
let wrapper;
beforeAll(async () => {
wrapper = await mountAndWait();
});
it('renders', async () => {
expect(wrapper.find(AlertList)).toExist();
});
it('renders a SubMenu', async () => {
expect(wrapper.find(SubMenu)).toExist();
});
it('renders a ListView', async () => {
expect(wrapper.find(ListView)).toExist();
});
it('renders switches', async () => {
expect(wrapper.find(Switch)).toHaveLength(3);
});
it('deletes', async () => {
act(() => {
wrapper.find('[data-test="delete-action"]').first().props().onClick();
});
await waitForComponentToPaint(wrapper);
act(() => {
wrapper
.find('#delete')
.first()
.props()
.onChange({ target: { value: 'DELETE' } });
});
await waitForComponentToPaint(wrapper);
act(() => {
wrapper
.find('[data-test="modal-confirm-button"]')
.last()
.props()
.onClick();
});
await waitForComponentToPaint(wrapper);
expect(fetchMock.calls(/report\/0/, 'DELETE')).toHaveLength(1);
});
it('shows/hides bulk actions when bulk actions is clicked', async () => {
const button = wrapper.find('[data-test="bulk-select-toggle"]').first();
act(() => {
button.props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(wrapper.find(IndeterminateCheckbox)).toHaveLength(
mockalerts.length + 1, // 1 for each row and 1 for select all
);
});
it('hides bulk actions when switch between alert and report list', async () => {
expect(wrapper.find(IndeterminateCheckbox)).toHaveLength(
mockalerts.length + 1,
);
expect(wrapper.find('[data-test="alert-list"]').hasClass('active')).toBe(
true,
);
expect(wrapper.find('[data-test="report-list"]').hasClass('active')).toBe(
false,
);
const reportWrapper = await mountAndWait({ isReportEnabled: true });
expect(fetchMock.calls(/report\/\?q/)[2][0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/report/?q=(filters:!((col:type,opr:eq,value:Report)),order_column:name,order_direction:desc,page:0,page_size:25)"`,
);
expect(
reportWrapper.find('[data-test="report-list"]').hasClass('active'),
).toBe(true);
expect(
reportWrapper.find('[data-test="alert-list"]').hasClass('active'),
).toBe(false);
expect(reportWrapper.find(IndeterminateCheckbox)).toHaveLength(0);
});
});

View File

@@ -1,334 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 { Provider } from 'react-redux';
import thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import fetchMock from 'fetch-mock';
import { act } from 'react-dom/test-utils';
import AlertReportModal from 'src/views/CRUD/alert/AlertReportModal';
import Modal from 'src/components/Modal';
import { AsyncSelect, NativeGraySelect as Select } from 'src/components/Select';
import { Switch } from 'src/components/Switch';
import { Radio } from 'src/components/Radio';
import TextAreaControl from 'src/explore/components/controls/TextAreaControl';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { styledMount as mount } from 'spec/helpers/theming';
const mockData = {
active: true,
id: 1,
name: 'test report',
description: 'test report description',
chart: { id: 1, slice_name: 'test chart' },
database: { id: 1, database_name: 'test database' },
sql: 'SELECT NaN',
};
const FETCH_REPORT_ENDPOINT = 'glob:*/api/v1/report/*';
const REPORT_PAYLOAD = { result: mockData };
fetchMock.get(FETCH_REPORT_ENDPOINT, REPORT_PAYLOAD);
const mockStore = configureStore([thunk]);
const store = mockStore({});
// Report mock is default for testing
const mockedProps = {
addDangerToast: () => {},
onAdd: jest.fn(() => []),
onHide: () => {},
show: true,
isReport: true,
};
// Related mocks
const ownersEndpoint = 'glob:*/api/v1/alert/related/owners?*';
const databaseEndpoint = 'glob:*/api/v1/alert/related/database?*';
const dashboardEndpoint = 'glob:*/api/v1/alert/related/dashboard?*';
const chartEndpoint = 'glob:*/api/v1/alert/related/chart?*';
fetchMock.get(ownersEndpoint, {
result: [],
});
fetchMock.get(databaseEndpoint, {
result: [],
});
fetchMock.get(dashboardEndpoint, {
result: [],
});
fetchMock.get(chartEndpoint, {
result: [],
});
async function mountAndWait(props = mockedProps) {
const mounted = mount(
<Provider store={store}>
<AlertReportModal show {...props} />
</Provider>,
{
context: { store },
},
);
await waitForComponentToPaint(mounted);
return mounted;
}
describe('AlertReportModal', () => {
let wrapper;
beforeAll(async () => {
wrapper = await mountAndWait();
});
it('renders', () => {
expect(wrapper.find(AlertReportModal)).toExist();
});
it('renders a Modal', () => {
expect(wrapper.find(Modal)).toExist();
});
it('render a empty modal', () => {
expect(wrapper.find('input[name="name"]').text()).toEqual('');
expect(wrapper.find('input[name="description"]').text()).toEqual('');
});
it('renders add header for report when no alert is included, and isReport is true', async () => {
const addWrapper = await mountAndWait();
expect(
addWrapper.find('[data-test="alert-report-modal-title"]').text(),
).toEqual('Add Report');
});
it('renders add header for alert when no alert is included, and isReport is false', async () => {
const props = {
...mockedProps,
isReport: false,
};
const addWrapper = await mountAndWait(props);
expect(
addWrapper.find('[data-test="alert-report-modal-title"]').text(),
).toEqual('Add Alert');
});
it('renders edit modal', async () => {
const props = {
...mockedProps,
alert: mockData,
};
const editWrapper = await mountAndWait(props);
expect(
editWrapper.find('[data-test="alert-report-modal-title"]').text(),
).toEqual('Edit Report');
expect(editWrapper.find('input[name="name"]').props().value).toEqual(
'test report',
);
expect(editWrapper.find('input[name="description"]').props().value).toEqual(
'test report description',
);
});
it('renders async select with value in alert edit modal', async () => {
const props = {
...mockedProps,
alert: mockData,
isReport: false,
};
const editWrapper = await mountAndWait(props);
expect(editWrapper.find(AsyncSelect).at(1).props().value).toEqual({
value: 1,
label: 'test database',
});
expect(editWrapper.find(AsyncSelect).at(2).props().value).toEqual({
value: 1,
label: 'test chart',
});
});
// Fields
it('renders input element for name', () => {
expect(wrapper.find('input[name="name"]')).toExist();
});
it('renders three async select elements when in report mode', () => {
expect(wrapper.find(AsyncSelect)).toExist();
expect(wrapper.find(AsyncSelect)).toHaveLength(3);
});
it('renders four async select elements when in alert mode', async () => {
const props = {
...mockedProps,
isReport: false,
};
const addWrapper = await mountAndWait(props);
expect(addWrapper.find(AsyncSelect)).toExist();
expect(addWrapper.find(AsyncSelect)).toHaveLength(4);
});
it('renders Switch element', () => {
expect(wrapper.find(Switch)).toExist();
});
it('renders input element for description', () => {
expect(wrapper.find('input[name="description"]')).toExist();
});
it('renders input element for sql in alert mode only', async () => {
const props = {
...mockedProps,
isReport: false,
};
const addWrapper = await mountAndWait(props);
expect(wrapper.find(TextAreaControl)).toHaveLength(0);
expect(addWrapper.find(TextAreaControl)).toExist();
});
it('renders input element for sql with NaN', async () => {
const props = {
...mockedProps,
alert: mockData,
isReport: false,
};
const editWrapper = await mountAndWait(props);
const input = editWrapper.find(TextAreaControl);
expect(input).toExist();
expect(input.props().value).toEqual('SELECT NaN');
});
it('renders one select element when in report mode', () => {
expect(wrapper.find(Select)).toExist();
expect(wrapper.find(Select)).toHaveLength(1);
});
it('renders two select elements when in alert mode', async () => {
const props = {
...mockedProps,
isReport: false,
};
const addWrapper = await mountAndWait(props);
expect(addWrapper.find(Select)).toExist();
expect(addWrapper.find(Select)).toHaveLength(2);
});
it('renders value input element when in alert mode', async () => {
const props = {
...mockedProps,
isReport: false,
};
const addWrapper = await mountAndWait(props);
expect(wrapper.find('input[name="threshold"]')).toHaveLength(0);
expect(addWrapper.find('input[name="threshold"]')).toExist();
});
it('renders four radio buttons', () => {
expect(wrapper.find(Radio)).toExist();
expect(wrapper.find(Radio)).toHaveLength(4);
});
it('renders input element for working timeout', () => {
expect(wrapper.find('input[name="working_timeout"]')).toExist();
});
it('renders input element for grace period for alert only', async () => {
const props = {
...mockedProps,
isReport: false,
};
const addWrapper = await mountAndWait(props);
expect(addWrapper.find('input[name="grace_period"]')).toExist();
expect(wrapper.find('input[name="grace_period"]')).toHaveLength(0);
});
it('only allows grace period values > 1', async () => {
const props = {
...mockedProps,
isReport: false,
};
const addWrapper = await mountAndWait(props);
const input = addWrapper.find('input[name="grace_period"]');
input.simulate('change', { target: { name: 'grace_period', value: 7 } });
expect(input.instance().value).toEqual('7');
input.simulate('change', { target: { name: 'grace_period', value: 0 } });
expect(input.instance().value).toEqual('');
input.simulate('change', { target: { name: 'grace_period', value: -1 } });
expect(input.instance().value).toEqual('1');
});
it('only allows working timeout values > 1', () => {
const input = wrapper.find('input[name="working_timeout"]');
input.simulate('change', { target: { name: 'working_timeout', value: 7 } });
expect(input.instance().value).toEqual('7');
input.simulate('change', { target: { name: 'working_timeout', value: 0 } });
expect(input.instance().value).toEqual('');
input.simulate('change', {
target: { name: 'working_timeout', value: -1 },
});
expect(input.instance().value).toEqual('1');
});
it('allows to add notification method', async () => {
const button = wrapper.find('[data-test="notification-add"]');
act(() => {
button.props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(
wrapper.find('[data-test="notification-add"]').props().status,
).toEqual('disabled');
act(() => {
wrapper
.find('[data-test="select-delivery-method"]')
.last()
.props()
.onChange('Email');
});
await waitForComponentToPaint(wrapper);
expect(wrapper.find('textarea[name="recipients"]')).toHaveLength(1);
});
});

View File

@@ -1,106 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 fetchMock from 'fetch-mock';
import React from 'react';
import { Provider } from 'react-redux';
import configureStore from 'redux-mock-store';
import thunk from 'redux-thunk';
import { styledMount as mount } from 'spec/helpers/theming';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import ListView from 'src/components/ListView';
import ExecutionLog from 'src/views/CRUD/alert/ExecutionLog';
// store needed for withToasts(ExecutionLog)
const mockStore = configureStore([thunk]);
const store = mockStore({});
const executionLogsEndpoint = 'glob:*/api/v1/report/*/log*';
const reportEndpoint = 'glob:*/api/v1/report/*';
fetchMock.delete(executionLogsEndpoint, {});
const mockannotations = [...new Array(3)].map((_, i) => ({
end_dttm: new Date().toISOString,
error_message: `report ${i} error message`,
id: i,
scheduled_dttm: new Date().toISOString,
start_dttm: new Date().toISOString,
state: 'Success',
value: `report ${i} value`,
uuid: 'f44da495-b067-4645-b463-3be98d5f3206',
}));
fetchMock.get(executionLogsEndpoint, {
ids: [2, 0, 1],
result: mockannotations,
count: 3,
});
fetchMock.get(reportEndpoint, {
id: 1,
result: { name: 'Test 0' },
});
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'), // use actual for all non-hook parts
useParams: () => ({ alertId: '1' }),
}));
async function mountAndWait(props) {
const mounted = mount(
<Provider store={store}>
<ExecutionLog {...props} />
</Provider>,
);
await waitForComponentToPaint(mounted);
return mounted;
}
describe('ExecutionLog', () => {
let wrapper;
beforeAll(async () => {
wrapper = await mountAndWait();
});
it('renders', () => {
expect(wrapper.find(ExecutionLog)).toExist();
});
it('renders a ListView', () => {
expect(wrapper.find(ListView)).toExist();
});
it('fetches report/alert', () => {
const callsQ = fetchMock.calls(/report\/1/);
expect(callsQ).toHaveLength(2);
expect(callsQ[1][0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/report/1"`,
);
});
it('fetches execution logs', () => {
const callsQ = fetchMock.calls(/report\/1\/log/);
expect(callsQ).toHaveLength(1);
expect(callsQ[0][0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/report/1/log/?q=(order_column:start_dttm,order_direction:desc,page:0,page_size:25)"`,
);
});
});

View File

@@ -1,163 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import fetchMock from 'fetch-mock';
import { Provider } from 'react-redux';
import { styledMount as mount } from 'spec/helpers/theming';
import AnnotationList from 'src/views/CRUD/annotation/AnnotationList';
import DeleteModal from 'src/components/DeleteModal';
import IndeterminateCheckbox from 'src/components/IndeterminateCheckbox';
import ListView from 'src/components/ListView';
import SubMenu from 'src/components/Menu/SubMenu';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { act } from 'react-dom/test-utils';
// store needed for withToasts(AnnotationList)
const mockStore = configureStore([thunk]);
const store = mockStore({});
const annotationsEndpoint = 'glob:*/api/v1/annotation_layer/*/annotation*';
const annotationLayerEndpoint = 'glob:*/api/v1/annotation_layer/*';
fetchMock.delete(annotationsEndpoint, {});
const mockannotations = [...new Array(3)].map((_, i) => ({
changed_on_delta_humanized: `${i} day(s) ago`,
created_by: {
first_name: `user`,
id: i,
},
changed_by: {
first_name: `user`,
id: i,
},
end_dttm: new Date().toISOString,
id: i,
long_descr: `annotation ${i} description`,
short_descr: `annotation ${i} label`,
start_dttm: new Date().toISOString,
}));
fetchMock.get(annotationsEndpoint, {
ids: [2, 0, 1],
result: mockannotations,
count: 3,
});
fetchMock.get(annotationLayerEndpoint, {
id: 1,
result: { descr: 'annotations test 0', name: 'Test 0' },
});
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'), // use actual for all non-hook parts
useParams: () => ({ annotationLayerId: '1' }),
}));
async function mountAndWait(props) {
const mounted = mount(
<Provider store={store}>
<AnnotationList {...props} />
</Provider>,
);
await waitForComponentToPaint(mounted);
return mounted;
}
describe('AnnotationList', () => {
let wrapper;
beforeAll(async () => {
wrapper = await mountAndWait();
});
it('renders', () => {
expect(wrapper.find(AnnotationList)).toExist();
});
it('renders a SubMenu', () => {
expect(wrapper.find(SubMenu)).toExist();
});
it('renders a ListView', () => {
expect(wrapper.find(ListView)).toExist();
});
it('fetches annotation layer', () => {
const callsQ = fetchMock.calls(/annotation_layer\/1/);
expect(callsQ).toHaveLength(2);
expect(callsQ[1][0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/annotation_layer/1"`,
);
});
it('fetches annotations', () => {
const callsQ = fetchMock.calls(/annotation_layer\/1\/annotation/);
expect(callsQ).toHaveLength(1);
expect(callsQ[0][0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/annotation_layer/1/annotation/?q=(order_column:short_descr,order_direction:desc,page:0,page_size:25)"`,
);
});
it('renders a DeleteModal', () => {
expect(wrapper.find(DeleteModal)).toExist();
});
it('deletes', async () => {
act(() => {
wrapper.find('[data-test="delete-action"]').first().props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(
wrapper.find(DeleteModal).first().props().description,
).toMatchInlineSnapshot(
`"Are you sure you want to delete annotation 0 label?"`,
);
act(() => {
wrapper
.find('#delete')
.first()
.props()
.onChange({ target: { value: 'DELETE' } });
});
await waitForComponentToPaint(wrapper);
act(() => {
wrapper.find('button').last().props().onClick();
});
await waitForComponentToPaint(wrapper);
});
it('shows/hides bulk actions when bulk actions is clicked', async () => {
const button = wrapper.find('[data-test="annotation-bulk-select"]').first();
act(() => {
button.props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(wrapper.find(IndeterminateCheckbox)).toHaveLength(
mockannotations.length + 1, // 1 for each row and 1 for select all
);
});
});

View File

@@ -1,99 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import { Provider } from 'react-redux';
import fetchMock from 'fetch-mock';
import AnnotationModal from 'src/views/CRUD/annotation/AnnotationModal';
import Modal from 'src/components/Modal';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { JsonEditor } from 'src/components/AsyncAceEditor';
import { styledMount as mount } from 'spec/helpers/theming';
const mockData = {
id: 1,
short_descr: 'annotation 1',
start_dttm: '2019-07-01T10:25:00',
end_dttm: '2019-06-11T10:25:00',
};
const FETCH_ANNOTATION_ENDPOINT =
'glob:*/api/v1/annotation_layer/*/annotation/*';
const ANNOTATION_PAYLOAD = { result: mockData };
fetchMock.get(FETCH_ANNOTATION_ENDPOINT, ANNOTATION_PAYLOAD);
const mockStore = configureStore([thunk]);
const store = mockStore({});
const mockedProps = {
addDangerToast: () => {},
annotation: mockData,
onAnnotationAdd: jest.fn(() => []),
onHide: () => {},
show: true,
};
async function mountAndWait(props = mockedProps) {
const mounted = mount(
<Provider store={store}>
<AnnotationModal show {...props} />
</Provider>,
);
await waitForComponentToPaint(mounted);
return mounted;
}
describe('AnnotationModal', () => {
let wrapper;
beforeAll(async () => {
wrapper = await mountAndWait();
});
it('renders', () => {
expect(wrapper.find(AnnotationModal)).toExist();
});
it('renders a Modal', () => {
expect(wrapper.find(Modal)).toExist();
});
it('renders add header when no annotation prop is included', async () => {
const addWrapper = await mountAndWait({});
expect(
addWrapper.find('[data-test="annotaion-modal-title"]').text(),
).toEqual('Add annotation');
});
it('renders edit header when annotation prop is included', () => {
expect(wrapper.find('[data-test="annotaion-modal-title"]').text()).toEqual(
'Edit annotation',
);
});
it('renders input elements for annotation name', () => {
expect(wrapper.find('input[name="short_descr"]')).toExist();
});
it('renders json editor for json metadata', () => {
expect(wrapper.find(JsonEditor)).toExist();
});
});

View File

@@ -1,92 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import { Provider } from 'react-redux';
import fetchMock from 'fetch-mock';
import AnnotationLayerModal from 'src/views/CRUD/annotationlayers/AnnotationLayerModal';
import Modal from 'src/components/Modal';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { styledMount as mount } from 'spec/helpers/theming';
const mockData = { id: 1, name: 'test', descr: 'test description' };
const FETCH_ANNOTATION_LAYER_ENDPOINT = 'glob:*/api/v1/annotation_layer/*';
const ANNOTATION_LAYER_PAYLOAD = { result: mockData };
fetchMock.get(FETCH_ANNOTATION_LAYER_ENDPOINT, ANNOTATION_LAYER_PAYLOAD);
const mockStore = configureStore([thunk]);
const store = mockStore({});
const mockedProps = {
addDangerToast: () => {},
onLayerAdd: jest.fn(() => []),
onHide: () => {},
show: true,
layer: mockData,
};
async function mountAndWait(props = mockedProps) {
const mounted = mount(
<Provider store={store}>
<AnnotationLayerModal show {...props} />
</Provider>,
);
await waitForComponentToPaint(mounted);
return mounted;
}
describe('AnnotationLayerModal', () => {
let wrapper;
beforeAll(async () => {
wrapper = await mountAndWait();
});
it('renders', () => {
expect(wrapper.find(AnnotationLayerModal)).toExist();
});
it('renders a Modal', () => {
expect(wrapper.find(Modal)).toExist();
});
it('renders add header when no layer is included', async () => {
const addWrapper = await mountAndWait({});
expect(
addWrapper.find('[data-test="annotation-layer-modal-title"]').text(),
).toEqual('Add annotation layer');
});
it('renders edit header when layer prop is included', () => {
expect(
wrapper.find('[data-test="annotation-layer-modal-title"]').text(),
).toEqual('Edit annotation layer properties');
});
it('renders input element for name', () => {
expect(wrapper.find('input[name="name"]')).toExist();
});
it('renders textarea element for description', () => {
expect(wrapper.find('textarea[name="descr"]')).toExist();
});
});

View File

@@ -1,168 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import fetchMock from 'fetch-mock';
import { Provider } from 'react-redux';
import { styledMount as mount } from 'spec/helpers/theming';
import AnnotationLayersList from 'src/views/CRUD/annotationlayers/AnnotationLayersList';
import AnnotationLayerModal from 'src/views/CRUD/annotationlayers/AnnotationLayerModal';
import SubMenu from 'src/components/Menu/SubMenu';
import ListView from 'src/components/ListView';
import Filters from 'src/components/ListView/Filters';
import DeleteModal from 'src/components/DeleteModal';
import Button from 'src/components/Button';
import IndeterminateCheckbox from 'src/components/IndeterminateCheckbox';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { act } from 'react-dom/test-utils';
// store needed for withToasts(AnnotationLayersList)
const mockStore = configureStore([thunk]);
const store = mockStore({});
const layersInfoEndpoint = 'glob:*/api/v1/annotation_layer/_info*';
const layersEndpoint = 'glob:*/api/v1/annotation_layer/?*';
const layerEndpoint = 'glob:*/api/v1/annotation_layer/*';
const layersRelatedEndpoint = 'glob:*/api/v1/annotation_layer/related/*';
const mocklayers = [...new Array(3)].map((_, i) => ({
changed_on_delta_humanized: `${i} day(s) ago`,
created_by: {
first_name: `user`,
last_name: `${i}`,
},
created_on: new Date().toISOString,
changed_on: new Date().toISOString,
id: i,
name: `layer ${i}`,
desc: 'layer description',
}));
const mockUser = {
userId: 1,
};
fetchMock.get(layersInfoEndpoint, {
permissions: ['can_write'],
});
fetchMock.get(layersEndpoint, {
result: mocklayers,
layers_count: 3,
});
fetchMock.delete(layerEndpoint, {});
fetchMock.delete(layersEndpoint, {});
fetchMock.get(layersRelatedEndpoint, {
created_by: {
count: 0,
result: [],
},
});
describe('AnnotationLayersList', () => {
const wrapper = mount(
<Provider store={store}>
<AnnotationLayersList store={store} user={mockUser} />
</Provider>,
);
beforeAll(async () => {
await waitForComponentToPaint(wrapper);
});
it('renders', () => {
expect(wrapper.find(AnnotationLayersList)).toExist();
});
it('renders a SubMenu', () => {
expect(wrapper.find(SubMenu)).toExist();
});
it('renders a ListView', () => {
expect(wrapper.find(ListView)).toExist();
});
it('renders a modal', () => {
expect(wrapper.find(AnnotationLayerModal)).toExist();
});
it('fetches layers', () => {
const callsQ = fetchMock.calls(/annotation_layer\/\?q/);
expect(callsQ).toHaveLength(1);
expect(callsQ[0][0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/annotation_layer/?q=(order_column:name,order_direction:desc,page:0,page_size:25)"`,
);
});
it('renders Filters', () => {
expect(wrapper.find(Filters)).toExist();
});
it('searches', async () => {
const filtersWrapper = wrapper.find(Filters);
act(() => {
filtersWrapper.find('[name="name"]').first().props().onSubmit('foo');
});
await waitForComponentToPaint(wrapper);
expect(fetchMock.lastCall()[0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/annotation_layer/?q=(filters:!((col:name,opr:ct,value:foo)),order_column:name,order_direction:desc,page:0,page_size:25)"`,
);
});
it('deletes', async () => {
act(() => {
wrapper.find('[data-test="delete-action"]').first().props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(
wrapper.find(DeleteModal).first().props().description,
).toMatchInlineSnapshot(`"This action will permanently delete the layer."`);
act(() => {
wrapper
.find('#delete')
.first()
.props()
.onChange({ target: { value: 'DELETE' } });
});
await waitForComponentToPaint(wrapper);
act(() => {
wrapper.find('button').last().props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(fetchMock.calls(/annotation_layer\/0/, 'DELETE')).toHaveLength(1);
});
it('shows/hides bulk actions when bulk actions is clicked', async () => {
const button = wrapper.find(Button).at(1);
act(() => {
button.props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(wrapper.find(IndeterminateCheckbox)).toHaveLength(
mocklayers.length + 1, // 1 for each row and 1 for select all
);
});
});

View File

@@ -1,203 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import { Provider } from 'react-redux';
import fetchMock from 'fetch-mock';
import * as featureFlags from 'src/featureFlags';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { styledMount as mount } from 'spec/helpers/theming';
import { render, screen, cleanup } from 'spec/helpers/testing-library';
import userEvent from '@testing-library/user-event';
import { QueryParamProvider } from 'use-query-params';
import { act } from 'react-dom/test-utils';
import ChartList from 'src/views/CRUD/chart/ChartList';
import ConfirmStatusChange from 'src/components/ConfirmStatusChange';
import ListView from 'src/components/ListView';
import PropertiesModal from 'src/explore/components/PropertiesModal';
import ListViewCard from 'src/components/ListViewCard';
// store needed for withToasts(ChartTable)
const mockStore = configureStore([thunk]);
const store = mockStore({});
const chartsInfoEndpoint = 'glob:*/api/v1/chart/_info*';
const chartssOwnersEndpoint = 'glob:*/api/v1/chart/related/owners*';
const chartsCreatedByEndpoint = 'glob:*/api/v1/chart/related/created_by*';
const chartsEndpoint = 'glob:*/api/v1/chart/*';
const chartsVizTypesEndpoint = 'glob:*/api/v1/chart/viz_types';
const chartsDatasourcesEndpoint = 'glob:*/api/v1/chart/datasources';
const chartFavoriteStatusEndpoint = 'glob:*/api/v1/chart/favorite_status*';
const datasetEndpoint = 'glob:*/api/v1/dataset/*';
const mockCharts = [...new Array(3)].map((_, i) => ({
changed_on: new Date().toISOString(),
creator: 'super user',
id: i,
slice_name: `cool chart ${i}`,
url: 'url',
viz_type: 'bar',
datasource_name: `ds${i}`,
thumbnail_url: '/thumbnail',
}));
const mockUser = {
userId: 1,
};
fetchMock.get(chartsInfoEndpoint, {
permissions: ['can_read', 'can_write'],
});
fetchMock.get(chartssOwnersEndpoint, {
result: [],
});
fetchMock.get(chartsCreatedByEndpoint, {
result: [],
});
fetchMock.get(chartFavoriteStatusEndpoint, {
result: [],
});
fetchMock.get(chartsEndpoint, {
result: mockCharts,
chart_count: 3,
});
fetchMock.get(chartsVizTypesEndpoint, {
result: [],
count: 0,
});
fetchMock.get(chartsDatasourcesEndpoint, {
result: [],
count: 0,
});
fetchMock.get(datasetEndpoint, {});
global.URL.createObjectURL = jest.fn();
fetchMock.get('/thumbnail', { body: new Blob(), sendAsJson: false });
describe('ChartList', () => {
const isFeatureEnabledMock = jest
.spyOn(featureFlags, 'isFeatureEnabled')
.mockImplementation(feature => feature === 'LISTVIEWS_DEFAULT_CARD_VIEW');
afterAll(() => {
isFeatureEnabledMock.restore();
});
const mockedProps = {};
const wrapper = mount(
<Provider store={store}>
<ChartList {...mockedProps} user={mockUser} />
</Provider>,
);
beforeAll(async () => {
await waitForComponentToPaint(wrapper);
});
it('renders', () => {
expect(wrapper.find(ChartList)).toExist();
});
it('renders a ListView', () => {
expect(wrapper.find(ListView)).toExist();
});
it('fetches info', () => {
const callsI = fetchMock.calls(/chart\/_info/);
expect(callsI).toHaveLength(1);
});
it('fetches data', () => {
wrapper.update();
const callsD = fetchMock.calls(/chart\/\?q/);
expect(callsD).toHaveLength(1);
expect(callsD[0][0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/chart/?q=(order_column:changed_on_delta_humanized,order_direction:desc,page:0,page_size:25)"`,
);
});
it('renders a card view', () => {
expect(wrapper.find(ListViewCard)).toExist();
});
it('renders a table view', async () => {
wrapper.find('[data-test="list-view"]').first().simulate('click');
await waitForComponentToPaint(wrapper);
expect(wrapper.find('table')).toExist();
});
it('edits', async () => {
expect(wrapper.find(PropertiesModal)).not.toExist();
wrapper.find('[data-test="edit-alt"]').first().simulate('click');
await waitForComponentToPaint(wrapper);
expect(wrapper.find(PropertiesModal)).toExist();
});
it('delete', async () => {
wrapper.find('[data-test="trash"]').first().simulate('click');
await waitForComponentToPaint(wrapper);
expect(wrapper.find(ConfirmStatusChange)).toExist();
});
});
describe('RTL', () => {
async function renderAndWait() {
const mounted = act(async () => {
const mockedProps = {};
render(
<QueryParamProvider>
<ChartList {...mockedProps} user={mockUser} />
</QueryParamProvider>,
{ useRedux: true },
);
});
return mounted;
}
let isFeatureEnabledMock;
beforeEach(async () => {
isFeatureEnabledMock = jest
.spyOn(featureFlags, 'isFeatureEnabled')
.mockImplementation(() => true);
await renderAndWait();
});
afterEach(() => {
cleanup();
isFeatureEnabledMock.mockRestore();
});
it('renders an "Import Chart" tooltip under import button', async () => {
const importButton = screen.getByTestId('import-button');
userEvent.hover(importButton);
await screen.findByRole('tooltip');
const importTooltip = screen.getByRole('tooltip', {
name: 'Import charts',
});
expect(importTooltip).toBeInTheDocument();
});
});

View File

@@ -1,93 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 thunk from 'redux-thunk';
import { Provider } from 'react-redux';
import configureStore from 'redux-mock-store';
import fetchMock from 'fetch-mock';
import CssTemplateModal from 'src/views/CRUD/csstemplates/CssTemplateModal';
import Modal from 'src/components/Modal';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { CssEditor } from 'src/components/AsyncAceEditor';
import { styledMount as mount } from 'spec/helpers/theming';
const mockData = { id: 1, template_name: 'test' };
const FETCH_CSS_TEMPLATE_ENDPOINT = 'glob:*/api/v1/css_template/*';
const CSS_TEMPLATE_PAYLOAD = { result: mockData };
fetchMock.get(FETCH_CSS_TEMPLATE_ENDPOINT, CSS_TEMPLATE_PAYLOAD);
const mockStore = configureStore([thunk]);
const store = mockStore({});
const mockedProps = {
addDangerToast: () => {},
onCssTemplateAdd: jest.fn(() => []),
onHide: () => {},
show: true,
cssTemplate: mockData,
};
async function mountAndWait(props = mockedProps) {
const mounted = mount(
<Provider store={store}>
<CssTemplateModal show {...props} />
</Provider>,
);
await waitForComponentToPaint(mounted);
return mounted;
}
describe('CssTemplateModal', () => {
let wrapper;
beforeAll(async () => {
wrapper = await mountAndWait();
});
it('renders', () => {
expect(wrapper.find(CssTemplateModal)).toExist();
});
it('renders a Modal', () => {
expect(wrapper.find(Modal)).toExist();
});
it('renders add header when no css template is included', async () => {
const addWrapper = await mountAndWait({});
expect(
addWrapper.find('[data-test="css-template-modal-title"]').text(),
).toEqual('Add CSS template');
});
it('renders edit header when css template prop is included', () => {
expect(
wrapper.find('[data-test="css-template-modal-title"]').text(),
).toEqual('Edit CSS template properties');
});
it('renders input elements for template name', () => {
expect(wrapper.find('input[name="template_name"]')).toExist();
});
it('renders css editor for css', () => {
expect(wrapper.find(CssEditor)).toExist();
});
});

View File

@@ -1,173 +0,0 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you 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 thunk from 'redux-thunk';
import configureStore from 'redux-mock-store';
import { Provider } from 'react-redux';
import fetchMock from 'fetch-mock';
import { styledMount as mount } from 'spec/helpers/theming';
import CssTemplatesList from 'src/views/CRUD/csstemplates/CssTemplatesList';
import SubMenu from 'src/components/Menu/SubMenu';
import ListView from 'src/components/ListView';
import Filters from 'src/components/ListView/Filters';
import DeleteModal from 'src/components/DeleteModal';
import Button from 'src/components/Button';
import IndeterminateCheckbox from 'src/components/IndeterminateCheckbox';
import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
import { act } from 'react-dom/test-utils';
// store needed for withToasts(DatabaseList)
const mockStore = configureStore([thunk]);
const store = mockStore({});
const templatesInfoEndpoint = 'glob:*/api/v1/css_template/_info*';
const templatesEndpoint = 'glob:*/api/v1/css_template/?*';
const templateEndpoint = 'glob:*/api/v1/css_template/*';
const templatesRelatedEndpoint = 'glob:*/api/v1/css_template/related/*';
const mocktemplates = [...new Array(3)].map((_, i) => ({
changed_on_delta_humanized: `${i} day(s) ago`,
created_by: {
first_name: `user`,
last_name: `${i}`,
},
created_on: new Date().toISOString,
css: 'css',
id: i,
template_name: `template ${i}`,
}));
const mockUser = {
userId: 1,
};
fetchMock.get(templatesInfoEndpoint, {
permissions: ['can_write'],
});
fetchMock.get(templatesEndpoint, {
result: mocktemplates,
templates_count: 3,
});
fetchMock.delete(templateEndpoint, {});
fetchMock.delete(templatesEndpoint, {});
fetchMock.get(templatesRelatedEndpoint, {
created_by: {
count: 0,
result: [],
},
});
describe('CssTemplatesList', () => {
const wrapper = mount(
<Provider store={store}>
<CssTemplatesList store={store} user={mockUser} />
</Provider>,
);
beforeAll(async () => {
await waitForComponentToPaint(wrapper);
});
it('renders', () => {
expect(wrapper.find(CssTemplatesList)).toExist();
});
it('renders a SubMenu', () => {
expect(wrapper.find(SubMenu)).toExist();
});
it('renders a ListView', () => {
expect(wrapper.find(ListView)).toExist();
});
it('fetches templates', () => {
const callsQ = fetchMock.calls(/css_template\/\?q/);
expect(callsQ).toHaveLength(1);
expect(callsQ[0][0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/css_template/?q=(order_column:template_name,order_direction:desc,page:0,page_size:25)"`,
);
});
it('renders Filters', () => {
expect(wrapper.find(Filters)).toExist();
});
it('searches', async () => {
const filtersWrapper = wrapper.find(Filters);
act(() => {
filtersWrapper
.find('[name="template_name"]')
.first()
.props()
.onSubmit('fooo');
});
await waitForComponentToPaint(wrapper);
expect(fetchMock.lastCall()[0]).toMatchInlineSnapshot(
`"http://localhost/api/v1/css_template/?q=(filters:!((col:template_name,opr:ct,value:fooo)),order_column:template_name,order_direction:desc,page:0,page_size:25)"`,
);
});
it('renders a DeleteModal', () => {
expect(wrapper.find(DeleteModal)).toExist();
});
it('deletes', async () => {
act(() => {
wrapper.find('[data-test="delete-action"]').first().props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(
wrapper.find(DeleteModal).first().props().description,
).toMatchInlineSnapshot(
`"This action will permanently delete the template."`,
);
act(() => {
wrapper
.find('#delete')
.first()
.props()
.onChange({ target: { value: 'DELETE' } });
});
await waitForComponentToPaint(wrapper);
act(() => {
wrapper.find('button').last().props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(fetchMock.calls(/css_template\/0/, 'DELETE')).toHaveLength(1);
});
it('shows/hides bulk actions when bulk actions is clicked', async () => {
const button = wrapper.find(Button).at(1);
act(() => {
button.props().onClick();
});
await waitForComponentToPaint(wrapper);
expect(wrapper.find(IndeterminateCheckbox)).toHaveLength(
mocktemplates.length + 1, // 1 for each row and 1 for select all
);
});
});