From 0ba8c641444732afedab2f45d7b8aae9a5582cba Mon Sep 17 00:00:00 2001 From: hypnos Date: Sun, 20 Aug 2017 20:45:37 +0300 Subject: [PATCH 1/3] Search box: make found options selectable with click --- lib/ui/package.json | 2 +- lib/ui/src/modules/ui/components/search_box.js | 13 ++++++++++--- .../src/modules/ui/components/search_box.test.js | 14 +++++++++++++- 3 files changed, 24 insertions(+), 5 deletions(-) diff --git a/lib/ui/package.json b/lib/ui/package.json index 9c82f46b0a7f..ed7ce92a22f8 100644 --- a/lib/ui/package.json +++ b/lib/ui/package.json @@ -14,7 +14,6 @@ "storybook": "start-storybook -p 9010" }, "dependencies": { - "@storybook/react-fuzzy": "^0.4.0", "@storybook/components": "^3.2.4", "babel-runtime": "^6.23.0", "deep-equal": "^1.0.1", @@ -30,6 +29,7 @@ "podda": "^1.2.2", "prop-types": "^15.5.10", "qs": "^6.4.0", + "react-fuzzy": "^0.4.1", "react-icons": "^2.2.5", "react-inspector": "^2.1.1", "react-komposer": "^2.0.0", diff --git a/lib/ui/src/modules/ui/components/search_box.js b/lib/ui/src/modules/ui/components/search_box.js index 657618b55658..2a50d80769b4 100644 --- a/lib/ui/src/modules/ui/components/search_box.js +++ b/lib/ui/src/modules/ui/components/search_box.js @@ -2,7 +2,7 @@ import { document } from 'global'; import PropTypes from 'prop-types'; import React from 'react'; import ReactModal from 'react-modal'; -import FuzzySearch from '@storybook/react-fuzzy'; +import FuzzySearch from 'react-fuzzy'; import { baseFonts } from '@storybook/components'; @@ -48,11 +48,18 @@ const formatStories = stories => { return formattedStories; }; -const suggestionTemplate = (props, state, styles) => +const suggestionTemplate = (props, state, styles, clickHandler) => state.results.map((val, i) => { const style = state.selectedIndex === i ? styles.selectedResultStyle : styles.resultsStyle; return ( -
+ // eslint-disable-next-line jsx-a11y/interactive-supports-focus +
clickHandler(i)} + > {val.value} {val.type === 'story' ? `in ${val.kind}` : 'Kind'} diff --git a/lib/ui/src/modules/ui/components/search_box.test.js b/lib/ui/src/modules/ui/components/search_box.test.js index 97915daedb91..624725a5148f 100644 --- a/lib/ui/src/modules/ui/components/search_box.test.js +++ b/lib/ui/src/modules/ui/components/search_box.test.js @@ -1,4 +1,4 @@ -import { shallow } from 'enzyme'; +import { shallow, mount } from 'enzyme'; import React from 'react'; import ReactModal from 'react-modal'; import FuzzySearch from '@storybook/react-fuzzy'; @@ -95,5 +95,17 @@ describe('manager.ui.components.search_box', () => { expect(onSelectStory).toHaveBeenCalledWith('b', 'a'); expect(onClose).toHaveBeenCalled(); }); + + test('should handle selecting a story with click', () => { + const onSelectStory = jest.fn(); + const onClose = jest.fn(); + const wrap = mount(); + + const option = wrap.findWhere(el => el.key() === 'a'); + option.simulate('click'); + + expect(onSelectStory).toHaveBeenCalledWith('b', 'a'); + expect(onClose).toHaveBeenCalled(); + }); }); }); From bd176f780ec9e113a4468f01ddd410250164164d Mon Sep 17 00:00:00 2001 From: hypnos Date: Sun, 20 Aug 2017 20:59:54 +0300 Subject: [PATCH 2/3] Fix test --- .../modules/ui/components/search_box.test.js | 23 +++++++++++++++---- 1 file changed, 18 insertions(+), 5 deletions(-) diff --git a/lib/ui/src/modules/ui/components/search_box.test.js b/lib/ui/src/modules/ui/components/search_box.test.js index 624725a5148f..9d54bf57a765 100644 --- a/lib/ui/src/modules/ui/components/search_box.test.js +++ b/lib/ui/src/modules/ui/components/search_box.test.js @@ -1,7 +1,7 @@ -import { shallow, mount } from 'enzyme'; +import { shallow } from 'enzyme'; import React from 'react'; import ReactModal from 'react-modal'; -import FuzzySearch from '@storybook/react-fuzzy'; +import FuzzySearch from 'react-fuzzy'; import SearchBox from './search_box'; @@ -97,14 +97,27 @@ describe('manager.ui.components.search_box', () => { }); test('should handle selecting a story with click', () => { + const stories = [ + { + kind: 'a', + stories: ['b', 'c'], + }, + ]; const onSelectStory = jest.fn(); const onClose = jest.fn(); - const wrap = mount(); + const wrap = shallow( + + ); + + const modal = wrap.find(FuzzySearch).dive(); + modal.find('input').simulate('change', { + target: { value: 'b' }, + }); - const option = wrap.findWhere(el => el.key() === 'a'); + const option = modal.findWhere(el => el.key() === 'b'); option.simulate('click'); - expect(onSelectStory).toHaveBeenCalledWith('b', 'a'); + expect(onSelectStory).toHaveBeenCalledWith('a', 'b'); expect(onClose).toHaveBeenCalled(); }); }); From 954f411b684d09e97af85770e8508e08b1b720cf Mon Sep 17 00:00:00 2001 From: "greenkeeper[bot]" Date: Thu, 24 Aug 2017 06:40:34 +0000 Subject: [PATCH 3/3] chore(package): update lerna to version 2.1.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index f26e56ad1492..824a05d649e6 100644 --- a/package.json +++ b/package.json @@ -61,7 +61,7 @@ "husky": "^0.14.3", "jest": "^20.0.4", "jest-enzyme": "^3.6.1", - "lerna": "2.0.0", + "lerna": "2.1.0", "lint-staged": "^4.0.2", "lodash": "^4.17.4", "nodemon": "^1.11.0",