mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 17:59:23 -04:00
Fix search field visibility on space selector screen (#54115)
This commit is contained in:
parent
dc8ff0d270
commit
4f9bf11620
2 changed files with 47 additions and 2 deletions
|
@ -5,10 +5,16 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { renderWithIntl, shallowWithIntl } from 'test_utils/enzyme_helpers';
|
||||
import {
|
||||
renderWithIntl,
|
||||
shallowWithIntl,
|
||||
mountWithIntl,
|
||||
nextTick,
|
||||
} from 'test_utils/enzyme_helpers';
|
||||
import { Space } from '../../../common/model/space';
|
||||
import { spacesManagerMock } from '../../lib/mocks';
|
||||
import { SpaceSelector } from './space_selector';
|
||||
import { findTestSubject } from 'test_utils/find_test_subject';
|
||||
|
||||
function getSpacesManager(spaces: Space[] = []) {
|
||||
const manager = spacesManagerMock.create();
|
||||
|
@ -74,3 +80,41 @@ test('it queries for spaces when not provided on props', () => {
|
|||
expect(spacesManager.getSpaces).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
});
|
||||
|
||||
test('it renders the search bar when there are 8 or more spaces', async () => {
|
||||
const spaces = [1, 2, 3, 4, 5, 6, 7, 8].map(num => ({
|
||||
id: `space-${num}`,
|
||||
name: `Space ${num}`,
|
||||
disabledFeatures: [],
|
||||
}));
|
||||
|
||||
const spacesManager = getSpacesManager(spaces);
|
||||
|
||||
const wrapper = mountWithIntl(
|
||||
<SpaceSelector.WrappedComponent spacesManager={spacesManager as any} intl={null as any} />
|
||||
);
|
||||
|
||||
await nextTick();
|
||||
wrapper.update();
|
||||
|
||||
expect(findTestSubject(wrapper, 'spaceSelectorSearchField')).toHaveLength(1);
|
||||
});
|
||||
|
||||
test('it does not render the search bar when there are fewer than 8 spaces', async () => {
|
||||
const spaces = [1, 2, 3, 4, 5, 6, 7].map(num => ({
|
||||
id: `space-${num}`,
|
||||
name: `Space ${num}`,
|
||||
disabledFeatures: [],
|
||||
}));
|
||||
|
||||
const spacesManager = getSpacesManager(spaces);
|
||||
|
||||
const wrapper = mountWithIntl(
|
||||
<SpaceSelector.WrappedComponent spacesManager={spacesManager as any} intl={null as any} />
|
||||
);
|
||||
|
||||
await nextTick();
|
||||
wrapper.update();
|
||||
|
||||
expect(findTestSubject(wrapper, 'spaceSelectorSearchField')).toHaveLength(0);
|
||||
});
|
||||
|
|
|
@ -155,7 +155,7 @@ class SpaceSelectorUI extends Component<Props, State> {
|
|||
|
||||
public getSearchField = () => {
|
||||
const { intl } = this.props;
|
||||
if (!this.props.spaces || this.props.spaces.length < SPACE_SEARCH_COUNT_THRESHOLD) {
|
||||
if (!this.state.spaces || this.state.spaces.length < SPACE_SEARCH_COUNT_THRESHOLD) {
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
|
@ -163,6 +163,7 @@ class SpaceSelectorUI extends Component<Props, State> {
|
|||
{
|
||||
// @ts-ignore onSearch doesn't exist on EuiFieldSearch
|
||||
<EuiFieldSearch
|
||||
data-test-subj="spaceSelectorSearchField"
|
||||
className="spcSpaceSelector__searchField"
|
||||
placeholder={intl.formatMessage({
|
||||
id: 'xpack.spaces.spaceSelector.findSpacePlaceholder',
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue