Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Remove the Space key from keyboard navigation on #267

Merged
merged 3 commits into from
May 19, 2016
Merged

Remove the Space key from keyboard navigation on #267

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d86a926
Fixes issue #265. Remove the Space key from keyboard navigation on
May 19, 2016
d72a94f
Merge branch 'release/1.0.0' into quality/DropMenu-no-space-key-capture
May 19, 2016
592f099
Merge branch 'release/1.0.0' into quality/DropMenu-no-space-key-capture
ogupte May 19, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 0 additions & 4 deletions src/components/Autocomplete/Autocomplete.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -139,10 +139,6 @@ const Autocomplete = createClass({
event.preventDefault();
}

if (event.keyCode === KEYCODE.Space) {
event.stopPropagation();
}

if (event.keyCode === KEYCODE.ArrowDown && !isExpanded) {
event.stopPropagation();

Expand Down
8 changes: 4 additions & 4 deletions src/components/DropMenu/DropMenu.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -106,15 +106,15 @@ const DropMenu = createClass({
*/
flyOutStyle: object,
/**
* Called when collapsed and the control is clicked, or when the control has focus and the Down Arrow or Space key is pressed.
* Called when collapsed and the control is clicked, or when the control has focus and the Down Arrow is pressed.
*/
onExpand: func,
/**
* Called when expanded and the user clicks the control or outside of the menu, or when the control has focus and the Escape key is pressed.
*/
onCollapse: func,
/**
* Called when an option is clicked, or when an option has focus and the Space or Enter key is pressed.
* Called when an option is clicked, or when an option has focus and the Enter key is pressed.
* Has the signature `(optionIndex, {props, event}) => {}` where optionIndex can be a number or `null`.
*/
onSelect: func,
Expand Down Expand Up @@ -257,7 +257,7 @@ const DropMenu = createClass({
});

if (isExpanded) {
if (_.includes([KEYCODE.Enter, KEYCODE.Space], e.keyCode)) {
if (e.keyCode === KEYCODE.Enter) {
e.preventDefault();
const focusedOptionData = _.get(flattenedOptionsData, focusedIndex, null);
const focusedOptionProps = _.get(focusedOptionData, 'optionProps', {});
Expand Down Expand Up @@ -300,7 +300,7 @@ const DropMenu = createClass({
}
}
} else {
if (_.includes([KEYCODE.Space, KEYCODE.ArrowDown], e.keyCode)) {
if (e.keyCode === KEYCODE.ArrowDown) {
e.preventDefault();
onExpand(e);
}
Expand Down
23 changes: 2 additions & 21 deletions src/components/DropMenu/DropMenu.spec.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -315,25 +315,6 @@ describe('DropMenu', () => {
});

describe('keyboard', () => {
it('should be called when DropMenu [not expanded, has focus, Space key pressed]', () => {
const onExpand = sinon.spy();
const wrapper = shallow(
<DropMenu isExpanded={false} onExpand={onExpand}>
<Control>control</Control>
<Option>option a</Option>
<Option>option b</Option>
<Option>option c</Option>
</DropMenu>
);

wrapper.find('.lucid-DropMenu-Control').simulate('keydown', {
keyCode: KEYCODE.Space,
preventDefault: _.noop,
});

assert(onExpand.called);
});

it('should be called when DropMenu [not expanded, has focus, Down Arrow key pressed]', () => {
const onExpand = sinon.spy();
const wrapper = shallow(
Expand Down Expand Up @@ -462,7 +443,7 @@ describe('DropMenu', () => {
});

describe('keyboard', () => {
it('should be called when DropMenu [expanded, option focused, Space key pressed]', () => {
it('should be called when DropMenu [expanded, option focused, Enter key pressed]', () => {
const onSelect = sinon.spy();
const wrapper = shallow(
<DropMenu isExpanded={true} focusedIndex={2} onSelect={onSelect}>
Expand All @@ -474,7 +455,7 @@ describe('DropMenu', () => {
);

wrapper.find('.lucid-DropMenu-Control').simulate('keydown', {
keyCode: KEYCODE.Space,
keyCode: KEYCODE.Enter,
preventDefault: _.noop,
});

Expand Down