diff --git a/.gitignore b/.gitignore index 820849c6..d9701b0a 100644 --- a/.gitignore +++ b/.gitignore @@ -7,3 +7,6 @@ yarn-error.log storybook-static +# Jetbrains IDEs +.idea + diff --git a/package.json b/package.json index c22ef5df..7bb59feb 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@sofarsounds/maestro", - "version": "5.0.0", + "version": "5.0.1", "description": "The official sofar sounds react uikit library", "main": "dist/index.js", "scripts": { diff --git a/src/molecules/Select/Input.test.tsx b/src/molecules/Select/Input.test.tsx index becf0d36..70fbd7a2 100644 --- a/src/molecules/Select/Input.test.tsx +++ b/src/molecules/Select/Input.test.tsx @@ -8,7 +8,8 @@ const mockClick = jest.fn(); const setup = ( isOpen: boolean = false, placeholder: string = 'I am a placeholder', - readonly: boolean = false + readonly: boolean = false, + dataQaId: string | undefined = undefined ) => mountWithTheme( I am a child component @@ -28,9 +30,8 @@ describe('Select ', () => { it('it has the correct style properties when isOpen is false', () => { let wrapper = setup(false); - let input = wrapper; - expect(input).toHaveStyleRule('border-radius', '2px'); - expect(input).not.toHaveStyleRule('box-shadow'); + expect(wrapper).toHaveStyleRule('border-radius', '2px'); + expect(wrapper).not.toHaveStyleRule('box-shadow'); }); /* TODO: Why this doesn't work */ @@ -40,11 +41,10 @@ describe('Select ', () => { it('it has the correct style properties when isOpen is true', () => { let wrapper = setup(true); - let input = wrapper; - expect(input).toHaveStyleRule('border-radius', '2px'); - expect(input).not.toHaveStyleRule('box-shadow'); + expect(wrapper).toHaveStyleRule('border-radius', '2px'); + expect(wrapper).not.toHaveStyleRule('box-shadow'); - expect(input).toHaveStyleRule( + expect(wrapper).toHaveStyleRule( 'box-shadow', '0 10px 20px 0 rgba(0,0,0,0.19)' ); @@ -56,6 +56,18 @@ describe('Select ', () => { expect(placeholder).toBe('I am a placeholder'); }); + it('it adds a data-qaid', () => { + let wrapper = setup(true, 'cat', true, 'testDataId'); + let qaid = wrapper.find('Input').props()['data-qaid']; + expect(qaid).toBe('testDataId'); + }); + + it('it handles no data-qaid', () => { + let wrapper = setup(); + let inputWrapper = wrapper.find('Input'); + expect(inputWrapper).toBeDefined(); + }); + it('it triggers onClick when clicked', () => { let wrapper = setup().find('button'); wrapper.simulate('click'); diff --git a/src/molecules/Select/Input.tsx b/src/molecules/Select/Input.tsx index 5dae726d..3d6ea30c 100644 --- a/src/molecules/Select/Input.tsx +++ b/src/molecules/Select/Input.tsx @@ -27,6 +27,7 @@ interface Props { hasError?: boolean; name?: string; id?: string; + 'data-qaid'?: string; } interface ButtonProps { @@ -100,7 +101,8 @@ const Input: React.SFC = ({ readonly, hasError, name, - id + id, + 'data-qaid': qaId }) => { return ( = ({ onClick={toggleSelect} isOpen={isOpen} ref={innerRef} + data-qaid={qaId} > {({ optionClick }: any) => cities.map((city, index) => (