1
0
Fork 1
mirror of https://github.com/SomboChea/ui synced 2024-06-18 17:29:43 +07:00
verdaccio-ui/test/unit/components/search.spec.js
Juan Picado @jotadeveloper 9d7be476ad chore: relocate unit test (#39)
add new json snapshot serializer
2019-05-01 21:02:46 +02:00

194 lines
6.5 KiB
JavaScript

/**
* @flow
* @prettier
*/
import React from 'react';
import { mount } from 'enzyme';
import { Search } from '../../../src/webui/components/Search/index';
const SEARCH_FILE_PATH = '../../../src/webui/components/Search/index';
const API_FILE_PATH = '../../../src/webui/utils/api';
const URL_FILE_PATH = '../../../src/webui/utils/url';
// Global mocks
const event = {
stopPropagation: jest.fn(),
};
window.location.assign = jest.fn();
describe('<Search /> component test', () => {
let wrapper;
beforeEach(() => {
wrapper = mount(<Search />);
});
test('should load the component in default state', () => {
expect(wrapper.html()).toMatchSnapshot();
});
test('onBlur: should cancel all search requests', async () => {
const { onBlur, requestList } = wrapper.instance();
const spy = jest.spyOn(wrapper.instance(), 'cancelAllSearchRequests');
const request = {
abort: jest.fn(),
};
// adds a request for AbortController
wrapper.instance().requestList = [request];
onBlur(event);
expect(request.abort).toHaveBeenCalled();
expect(event.stopPropagation).toHaveBeenCalled();
expect(wrapper.state('error')).toBeFalsy();
expect(wrapper.state('loaded')).toBeFalsy();
expect(wrapper.state('loading')).toBeFalsy();
expect(spy).toHaveBeenCalled();
expect(requestList).toEqual([]);
});
test('handleSearch: when user type package name in search component and set loading to true', () => {
const { handleSearch } = wrapper.instance();
const newValue = 'verdaccio';
handleSearch(event, { newValue, method: 'type' });
expect(event.stopPropagation).toHaveBeenCalled();
expect(wrapper.state('error')).toBeFalsy();
expect(wrapper.state('loaded')).toBeFalsy();
expect(wrapper.state('loading')).toBeTruthy();
expect(wrapper.state('search')).toEqual(newValue);
});
test('handleSearch: cancel all search requests when there is no value in search component with type method', () => {
const { handleSearch, requestList } = wrapper.instance();
const spy = jest.spyOn(wrapper.instance(), 'cancelAllSearchRequests');
const newValue = '';
handleSearch(event, { newValue, method: 'type' });
expect(event.stopPropagation).toHaveBeenCalled();
expect(wrapper.state('error')).toBeFalsy();
expect(wrapper.state('loaded')).toBeFalsy();
expect(wrapper.state('loading')).toBeTruthy();
expect(wrapper.state('search')).toEqual(newValue);
expect(spy).toHaveBeenCalled();
expect(requestList).toEqual([]);
});
test('handleSearch: when method is not type method', () => {
const { handleSearch } = wrapper.instance();
const newValue = '';
handleSearch(event, { newValue, method: 'click' });
expect(event.stopPropagation).toHaveBeenCalled();
expect(wrapper.state('error')).toBeFalsy();
expect(wrapper.state('loaded')).toBeFalsy();
expect(wrapper.state('loading')).toBeFalsy();
expect(wrapper.state('search')).toEqual(newValue);
});
test('handlePackagesClearRequested: should clear suggestions', () => {
const { handlePackagesClearRequested } = wrapper.instance();
handlePackagesClearRequested();
expect(wrapper.state('suggestions')).toEqual([]);
});
});
describe('<Search /> component: mocks specific tests ', () => {
beforeEach(() => {
jest.resetModules();
jest.doMock('lodash/debounce', () => {
return function debounceMock(fn, delay) {
return fn;
};
});
});
test('handleFetchPackages: should load the packages from API', async () => {
const apiResponse = [{ name: 'verdaccio' }, { name: 'verdaccio-htpasswd' }];
const suggestions = [{ name: 'verdaccio' }, { name: 'verdaccio-htpasswd' }];
jest.doMock(API_FILE_PATH, () => ({
request(url) {
expect(url).toEqual('search/verdaccio');
return Promise.resolve(apiResponse);
},
}));
const Search = require(SEARCH_FILE_PATH).Search;
const component = mount(<Search />);
component.setState({ search: 'verdaccio' });
const { handleFetchPackages } = component.instance();
await handleFetchPackages({ value: 'verdaccio' });
expect(component.state('suggestions')).toEqual(suggestions);
expect(component.state('error')).toBeFalsy();
expect(component.state('loaded')).toBeTruthy();
expect(component.state('loading')).toBeFalsy();
});
test('handleFetchPackages: when browser cancel a request', async () => {
const apiResponse = { name: 'AbortError' };
jest.doMock(API_FILE_PATH, () => ({ request: jest.fn(() => Promise.reject(apiResponse)) }));
const Search = require(SEARCH_FILE_PATH).Search;
const component = mount(<Search />);
component.setState({ search: 'verdaccio' });
const { handleFetchPackages } = component.instance();
await handleFetchPackages({ value: 'verdaccio' });
expect(component.state('error')).toBeFalsy();
expect(component.state('loaded')).toBeFalsy();
expect(component.state('loading')).toBeFalsy();
});
test('handleFetchPackages: when API server failed request', async () => {
const apiResponse = { name: 'BAD_REQUEST' };
jest.doMock(API_FILE_PATH, () => ({
request(url) {
expect(url).toEqual('search/verdaccio');
return Promise.reject(apiResponse);
},
}));
const Search = require(SEARCH_FILE_PATH).Search;
const component = mount(<Search />);
component.setState({ search: 'verdaccio' });
const { handleFetchPackages } = component.instance();
await handleFetchPackages({ value: 'verdaccio' });
expect(component.state('error')).toBeTruthy();
expect(component.state('loaded')).toBeFalsy();
expect(component.state('loading')).toBeFalsy();
});
test('handleClickSearch: should change the window location on click or return key', () => {
const getDetailPageURL = jest.fn(() => 'detail/page/url');
jest.doMock(URL_FILE_PATH, () => ({ getDetailPageURL }));
const suggestionValue = [];
const Search = require(SEARCH_FILE_PATH).Search;
const pushHandler = jest.fn();
const component = mount(<Search history={{ push: pushHandler }} />);
const { handleClickSearch } = component.instance();
// click
handleClickSearch(event, { suggestionValue, method: 'click' });
expect(event.stopPropagation).toHaveBeenCalled();
expect(pushHandler).toHaveBeenCalledTimes(1);
// return key
handleClickSearch(event, { suggestionValue, method: 'enter' });
expect(event.stopPropagation).toHaveBeenCalled();
expect(pushHandler).toHaveBeenCalledTimes(2);
});
});