diff --git a/README.md b/README.md
index ae722a49..e2091473 100644
--- a/README.md
+++ b/README.md
@@ -47,7 +47,6 @@ change the state of the checkbox.
-
- [Installation](#installation)
- [API](#api)
- [`click(element, eventInit, options)`](#clickelement-eventinit-options)
@@ -202,6 +201,8 @@ The following special character strings are supported:
| `{arrowright}` | ArrowRight | N/A | |
| `{arrowup}` | ArrowUp | N/A | |
| `{arrowdown}` | ArrowDown | N/A | |
+| `{home}` | Home | N/A | |
+| `{end}` | End | N/A | |
| `{shift}` | Shift | `shiftKey` | Does **not** capitalize following characters. |
| `{ctrl}` | Control | `ctrlKey` | |
| `{alt}` | Alt | `altKey` | |
@@ -686,6 +687,7 @@ Thanks goes to these people ([emoji key][emojis]):
+
This project follows the [all-contributors][all-contributors] specification.
diff --git a/src/__tests__/type.js b/src/__tests__/type.js
index 80588319..18fb97d5 100644
--- a/src/__tests__/type.js
+++ b/src/__tests__/type.js
@@ -1067,6 +1067,56 @@ test('navigation key: {arrowleft} and {arrowright} moves the cursor', () => {
`)
})
+test('navigation key: {home} and {end} moves the cursor', () => {
+ const {element, getEventSnapshot} = setup('')
+ userEvent.type(element, 'c{home}ab{end}d')
+ expect(getEventSnapshot()).toMatchInlineSnapshot(`
+ Events fired on: input[value="abcd"]
+
+ input[value=""] - pointerover
+ input[value=""] - pointerenter
+ input[value=""] - mouseover: Left (0)
+ input[value=""] - mouseenter: Left (0)
+ input[value=""] - pointermove
+ input[value=""] - mousemove: Left (0)
+ input[value=""] - pointerdown
+ input[value=""] - mousedown: Left (0)
+ input[value=""] - focus
+ input[value=""] - focusin
+ input[value=""] - pointerup
+ input[value=""] - mouseup: Left (0)
+ input[value=""] - click: Left (0)
+ input[value=""] - keydown: c (99)
+ input[value=""] - keypress: c (99)
+ input[value="c"] - input
+ "{CURSOR}" -> "c{CURSOR}"
+ input[value="c"] - keyup: c (99)
+ input[value="c"] - keydown: Home (36)
+ input[value="c"] - select
+ input[value="c"] - keyup: Home (36)
+ input[value="c"] - keydown: a (97)
+ input[value="c"] - keypress: a (97)
+ input[value="ac"] - input
+ "{CURSOR}c" -> "ac{CURSOR}"
+ input[value="ac"] - select
+ input[value="ac"] - keyup: a (97)
+ input[value="ac"] - keydown: b (98)
+ input[value="ac"] - keypress: b (98)
+ input[value="abc"] - input
+ "a{CURSOR}c" -> "abc{CURSOR}"
+ input[value="abc"] - select
+ input[value="abc"] - keyup: b (98)
+ input[value="abc"] - keydown: End (35)
+ input[value="abc"] - select
+ input[value="abc"] - keyup: End (35)
+ input[value="abc"] - keydown: d (100)
+ input[value="abc"] - keypress: d (100)
+ input[value="abcd"] - input
+ "abc{CURSOR}" -> "abcd{CURSOR}"
+ input[value="abcd"] - keyup: d (100)
+ `)
+})
+
test('can type into an input with type `time`', () => {
const {element, getEventSnapshot} = setup('')
userEvent.type(element, '01:05')
diff --git a/src/keys/navigation-key.js b/src/keys/navigation-key.js
index d232f90b..2bbcce8c 100644
--- a/src/keys/navigation-key.js
+++ b/src/keys/navigation-key.js
@@ -3,6 +3,12 @@ import {fireEvent} from '@testing-library/dom'
import {setSelectionRangeIfNecessary} from '../utils'
const keys = {
+ Home: {
+ keyCode: 36,
+ },
+ End: {
+ keyCode: 35,
+ },
ArrowLeft: {
keyCode: 37,
},
@@ -13,6 +19,21 @@ const keys = {
function getSelectionRange(currentElement, key) {
const {selectionStart, selectionEnd} = currentElement()
+
+ if (key === 'Home') {
+ return {
+ selectionStart: 0,
+ selectionEnd: 0,
+ }
+ }
+
+ if (key === 'End') {
+ return {
+ selectionStart: selectionEnd + 1,
+ selectionEnd: selectionEnd + 1,
+ }
+ }
+
const cursorChange = Number(key in keys) * (key === 'ArrowLeft' ? -1 : 1)
return {
selectionStart: selectionStart + cursorChange,
diff --git a/src/type.js b/src/type.js
index 336e4533..71fdf1cd 100644
--- a/src/type.js
+++ b/src/type.js
@@ -96,6 +96,8 @@ const specialCharMap = {
escape: '{esc}',
delete: '{del}',
backspace: '{backspace}',
+ home: '{home}',
+ end: '{end}',
selectAll: '{selectall}',
space: '{space}',
whitespace: ' ',
@@ -106,6 +108,8 @@ const specialCharCallbackMap = {
[specialCharMap.arrowRight]: navigationKey('ArrowRight'),
[specialCharMap.arrowDown]: handleArrowDown,
[specialCharMap.arrowUp]: handleArrowUp,
+ [specialCharMap.home]: navigationKey('Home'),
+ [specialCharMap.end]: navigationKey('End'),
[specialCharMap.enter]: handleEnter,
[specialCharMap.escape]: handleEsc,
[specialCharMap.delete]: handleDel,