123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117 |
- import React from 'react';
- import {mount} from 'enzyme';
- import {openCommandPalette} from 'app/actionCreators/modal';
- import App from 'app/views/app';
- import FormSearchStore from 'app/stores/formSearchStore';
- import {navigateTo} from 'app/actionCreators/navigation';
- jest.mock('jquery');
- jest.mock('app/actionCreators/formSearch');
- jest.mock('app/actionCreators/navigation');
- describe('Command Palette Modal', function() {
- let orgsMock;
- beforeEach(function() {
- FormSearchStore.onLoadSearchMap([]);
- MockApiClient.clearMockResponses();
- orgsMock = MockApiClient.addMockResponse({
- url: '/organizations/',
- body: [TestStubs.Organization({slug: 'billy-org', name: 'billy org'})],
- });
- MockApiClient.addMockResponse({
- url: '/organizations/org-slug/projects/',
- query: 'foo',
- body: [TestStubs.Project({slug: 'foo-project'})],
- });
- MockApiClient.addMockResponse({
- url: '/organizations/org-slug/teams/',
- query: 'foo',
- body: [TestStubs.Team({slug: 'foo-team'})],
- });
- MockApiClient.addMockResponse({
- url: '/organizations/org-slug/members/',
- query: 'foo',
- body: TestStubs.Members(),
- });
- MockApiClient.addMockResponse({
- url: '/internal/health/',
- body: {
- problems: [],
- },
- });
- MockApiClient.addMockResponse({
- url: '/assistant/',
- body: [],
- });
- });
- it('can open command palette modal and search', async function() {
- const wrapper = mount(
- <App params={{orgId: 'org-slug'}}>{<div>placeholder content</div>}</App>,
- TestStubs.routerContext([
- {
- router: TestStubs.router({
- params: {orgId: 'org-slug'},
- }),
- },
- ])
- );
- // No Modal
- expect(wrapper.find('ModalDialog')).toHaveLength(0);
- openCommandPalette({params: {orgId: 'org-slug'}});
- await tick();
- await tick();
- wrapper.update();
- // Should have Modal + input
- expect(wrapper.find('ModalDialog')).toHaveLength(1);
- wrapper.find('ModalDialog input').simulate('change', {target: {value: 'bil'}});
- await tick();
- wrapper.update();
- expect(orgsMock).toHaveBeenCalledWith(
- expect.anything(),
- expect.objectContaining({
- // This nested 'query' is correct
- query: {query: 'bil'},
- })
- );
- expect(
- wrapper
- .find('SearchResult [data-test-id="badge-display-name"]')
- .first()
- .text()
- ).toBe('billy-org Dashboard');
- expect(
- wrapper
- .find('ModalDialog SearchResultWrapper')
- .first()
- .prop('highlighted')
- ).toBe(true);
- expect(
- wrapper
- .find('ModalDialog SearchResultWrapper')
- .at(1)
- .prop('highlighted')
- ).toBe(false);
- wrapper
- .find('SearchResult [data-test-id="badge-display-name"]')
- .first()
- .simulate('click');
- expect(navigateTo).toHaveBeenCalledWith('/billy-org/', expect.anything());
- });
- });
|