QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-04-07 10:31:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(Dashboard): Omnibar dropdown visibility and keyboard commands (#16168)

Browse Source 
* Fix style and implement ESC

* Include ESC test case

* Update superset-frontend/src/components/OmniContainer/OmniContainer.test.tsx

Co-authored-by: Evan Rusackas <evan@preset.io>

Co-authored-by: Evan Rusackas <evan@preset.io>
This commit is contained in:
Geido
2021-08-13 18:44:49 +02:00
committed by GitHub
parent 4ae88ce3b4
commit c09f6ed15b
2 changed files with 17 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
superset-frontend/src/components/OmniContainer/OmniContainer.test.tsx
View File

@@ -84,40 +84,6 @@ test('Open Omnibar with ctrl + k with featureflag enabled', () => {
).not.toBeVisible();
});
test('Open Omnibar with ctrl + s with featureflag enabled', () => {
(isFeatureEnabled as jest.Mock).mockImplementation(
(ff: string) => ff === 'OMNIBAR',
);
const logEvent = jest.fn();
render(
<div data-test="test">
<OmniContainer logEvent={logEvent} />
</div>,
);
expect(
screen.queryByPlaceholderText('Search all dashboards'),
).not.toBeInTheDocument();
// show Omnibar
fireEvent.keyDown(screen.getByTestId('test'), {
ctrlKey: true,
code: 'KeyS',
});
expect(
screen.queryByPlaceholderText('Search all dashboards'),
).toBeInTheDocument();
// hide Omnibar
fireEvent.keyDown(screen.getByTestId('test'), {
ctrlKey: true,
code: 'KeyS',
});
expect(
screen.queryByPlaceholderText('Search all dashboards'),
).not.toBeVisible();
});
test('Open Omnibar with Command + k with featureflag enabled', () => {
(isFeatureEnabled as jest.Mock).mockImplementation(
(ff: string) => ff === 'OMNIBAR',
@@ -152,7 +118,7 @@ test('Open Omnibar with Command + k with featureflag enabled', () => {
).not.toBeVisible();
});
test('Open Omnibar with Command + s with featureflag enabled', () => {
test('Open Omnibar with Cmd/Ctrl-K and close with ESC', () => {
(isFeatureEnabled as jest.Mock).mockImplementation(
(ff: string) => ff === 'OMNIBAR',
);
@@ -169,17 +135,17 @@ test('Open Omnibar with Command + s with featureflag enabled', () => {
// show Omnibar
fireEvent.keyDown(screen.getByTestId('test'), {
metaKey: true,
code: 'KeyS',
ctrlKey: true,
code: 'KeyK',
});
expect(
screen.queryByPlaceholderText('Search all dashboards'),
).toBeInTheDocument();
// hide Omnibar
// Close Omnibar
fireEvent.keyDown(screen.getByTestId('test'), {
metaKey: true,
code: 'KeyS',
key: 'Escape',
code: 'Escape',
});
expect(
screen.queryByPlaceholderText('Search all dashboards'),

12
superset-frontend/src/components/OmniContainer/index.tsx
View File

@@ -31,6 +31,7 @@ const OmniModal = styled(Modal)`
.ant-modal-body {
padding: 0;
overflow: visible;
}
`;
@@ -47,7 +48,16 @@ export default function OmniContainer({ logEvent }: Props) {
function handleKeydown(event: KeyboardEvent) {
if (!isFeatureEnabled(FeatureFlag.OMNIBAR)) return;
const controlOrCommand = event.ctrlKey || event.metaKey;
const isOk = ['KeyK', 'KeyS'].includes(event.code); // valid keys "s" or "k"
const isOk = ['KeyK'].includes(event.code);
const isEsc = event.key === 'Escape';
if (isEsc && showOmni.current) {
logEvent(LOG_ACTIONS_OMNIBAR_TRIGGERED, {
show_omni: false,
});
showOmni.current = false;
setShowModal(false);
return;
}
if (controlOrCommand && isOk) {
logEvent(LOG_ACTIONS_OMNIBAR_TRIGGERED, {
show_omni: !!showOmni.current,