-
-
Notifications
You must be signed in to change notification settings - Fork 9.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Select knob key/value ordering #1745
Changes from 17 commits
a12d5c5
4791306
c19a445
68b543a
0605b99
320a3d8
92a68f0
81864f8
571069b
475dae7
a188468
880069d
c0c8f3c
b3e785e
1d1f0a7
1fa81fb
b2f22ae
0a1140f
5928842
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,4 @@ | ||
import deprecate from 'util-deprecate'; | ||
import KnobManager from './KnobManager'; | ||
|
||
export const manager = new KnobManager(); | ||
|
@@ -46,7 +47,14 @@ export function object(name, value) { | |
} | ||
|
||
export function select(name, options, value) { | ||
return manager.knob(name, { type: 'select', options, value }); | ||
return deprecate( | ||
manager.knob.bind(manager), | ||
'in v4 keys/values of the options argument are reversed' | ||
)(name, { type: 'select', options, value }); | ||
} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This should probably be rewritten as follows:
See #1745 (comment) There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. thanks! I was missing the arrow function before and passing the result of |
||
|
||
export function selectV2(name, options, value) { | ||
return manager.knob(name, { type: 'select', selectV2: true, options, value }); | ||
} | ||
|
||
export function array(name, value, separator = ',') { | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
import React from 'react'; | ||
import { shallow } from 'enzyme'; // eslint-disable-line | ||
import SelectType from '../types/Select'; | ||
|
||
describe('Select', () => { | ||
let knob; | ||
|
||
beforeEach(() => { | ||
knob = { | ||
name: 'Colors', | ||
value: '#00ff00', | ||
options: { | ||
Green: '#00ff00', | ||
Red: '#ff0000', | ||
}, | ||
}; | ||
}); | ||
|
||
it('displays value', () => { | ||
const wrapper = shallow(<SelectType knob={knob} />); | ||
|
||
const green = wrapper.find('option').first(); | ||
expect(green.text()).toEqual('#00ff00'); | ||
expect(green.prop('value')).toEqual('Green'); | ||
}); | ||
|
||
describe('selectV2', () => { | ||
beforeEach(() => { | ||
knob.selectV2 = true; | ||
}); | ||
|
||
it('correctly maps option keys and values', () => { | ||
const wrapper = shallow(<SelectType knob={knob} />); | ||
|
||
const green = wrapper.find('option').first(); | ||
expect(green.text()).toEqual('Green'); | ||
expect(green.prop('value')).toEqual('#00ff00'); | ||
}); | ||
}); | ||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
For some reason, it throws in unit tests:
https://circleci.com/gh/storybooks/storybook/33655?utm_campaign=vcs-integration-link&utm_medium=referral&utm_source=github-build-link
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I was doing it wrong :)
fixed this up and added selectV2 example