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

fix(masthead-search): react searchNoRedirect prop doesn't work on enter #8541

Merged
merged 2 commits into from
Mar 17, 2022
Merged

fix(masthead-search): react searchNoRedirect prop doesn't work on enter #8541

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
fcabb0b
fix(masthead-search): react searchNoRedirect prop doesn't work on ent…
ariellalgilmore Mar 16, 2022
8111c5d
Merge branch 'release/v1.32.0' into fix/search-no-redirect
kennylam Mar 17, 2022
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
2 changes: 2 additions & 0 deletions packages/react/src/__tests__/__snapshots__/storyshots.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52869,6 +52869,7 @@ exports[`Storyshots Components|Dotcom shell Search open 1`] = `
"aria-label": "Search all of IBM",
"className": "bx--header__search--input",
"onChange": [Function],
"onKeyDown": [Function],
"placeholder": "Search all of IBM",
"role": "combobox",
"value": "",
Expand Down Expand Up @@ -123762,6 +123763,7 @@ exports[`Storyshots Components|Masthead Search open onload 1`] = `
"aria-label": "Search all of IBM",
"className": "bx--header__search--input",
"onChange": [Function],
"onKeyDown": [Function],
"placeholder": "Search all of IBM",
"role": "combobox",
"value": "",
Expand Down
22 changes: 22 additions & 0 deletions packages/react/src/components/Masthead/MastheadSearch.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -270,6 +270,27 @@ const MastheadSearch = forwardRef(
event.currentTarget.dispatchEvent(onSearchNoRedirect);
}

/**
* Custom onKeyDown event handlers
*
* @param {event} event The callback event
*/
function onKeyDown(event) {
switch (event.key) {
case 'Enter': {
// Disables Enter key if searchNoRirect is true
if (rest.searchNoRedirect) {
onSearchNoRedirect(event, state.val);
event.preventDefault();
}
// Disable search on enter key if the search field is empty
if (!state.val) {
event.preventDefault();
}
}
}
}

/**
* When the input field changes, we set the new val to our state
*
Expand All @@ -296,6 +317,7 @@ const MastheadSearch = forwardRef(
placeholder: placeHolderText,
value: state.val,
onChange,
onKeyDown,
className: `${prefix}--header__search--input`,
'aria-label': placeHolderText,
role: 'combobox',
Expand Down