Skip to content

[BUG] Delete and Backspace are treated as the same key #159

@nick-filigree

Description

@nick-filigree

Describe the bug
Delete and Backspace are different keys, yet react-hotkeys appears to consider them one and the same.

How are you using react hotkeys components? (HotKeys, GlobalHotKeys, IgnoreKeys etc)
HotKeys

Repro case:

import React from 'react';
import {HotKeys} from 'react-hotkeys';

const keyHandlers = {
  DELETE: e => {
    console.log('DELETE', e ? e.key : undefined);
  },
  BACKSPACE: e => {
    console.log('BACKSPACE', e ? e.key : undefined);
  },
};
const keyMap = {
  DELETE: 'Delete',
  BACKSPACE: 'Backspace',
};

const App = () => (
  <HotKeys keyMap={keyMap} handlers={keyHandlers}>
    <div style={{width: '100px', height: '100px', backgroundColor: 'red'}} />
  </HotKeys>
);

export default App;

Expected behavior
Pressing Delete triggers the DELETE handler, which prints "DELETE Delete" to console; pressing Backspace triggers the BACKSPACE handler, which prints "BACKSPACE Backspace"

Actual behavior
Pressing either backspace or delete triggers the DELETE handler only, with "DELETE Backspace" printed for the backspace key and "DELETE Delete" printed for the delete key.

Platform (please complete the following information):

  • Version of react-hotkey: v2.0.0-pre4
  • Browser: Chrome 73
  • OS: macOS 10.14.3

Are you willing and able to create a PR request to fix this issue?
No -- I'm not familiar with the codebase

APPLICABLE TO v2.0.0-pre1 AND ABOVE: ======================

Include the smallest log that includes your issue:

Set logging to verbose (you'll need the development build if its possible):

import { configure } from 'react-hotkeys';

configure({
  logLevel: 'verbose'
})

What Configuration options are you using?
None

configure({
  //options
})

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions