Skip to content

Commit 72f1917

Browse files
docs: updates cy.press() documentation to include expanded named keys, as well as utf-8 characters (#6256)
* docs: updates cy.press() documentation to include expanded named keys, as well as utf-8 characters * lint * updates to structure * lint --------- Co-authored-by: Jennifer Shehane <[email protected]>
1 parent 85aed76 commit 72f1917

File tree

1 file changed

+81
-13
lines changed

1 file changed

+81
-13
lines changed

docs/api/commands/press.mdx

Lines changed: 81 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,7 @@ Trigger native key events in your application to simulate keyboard interactions.
1414

1515
A `keydown`, `press`, and `keyup` event will be dispatched directly to the browser window.
1616

17-
Unlike `cy.type()`, which is best for typing character keys, `cy.press()` will dispatch real keyboard events rather than simulated ones. This command is especially useful when testing focus management and keyboard navigation patterns which are critical for [accessibility testing](/app/guides/accessibility-testing) and great keyboard UX.
18-
19-
Currently, the only key supported is `Tab`.
17+
Unlike `cy.type()`, which is best for typing multiple character keys, `cy.press()` will dispatch real keyboard events rather than simulated ones. This command is especially useful when testing focus management and keyboard navigation patterns which are critical for [accessibility testing](/app/guides/accessibility-testing) and great keyboard UX.
2018

2119
:::caution
2220

@@ -68,13 +66,40 @@ cy.press(Cypress.Keyboard.Keys.TAB)
6866

6967
<Icon name="angle-right" /> **key _(String)_**
7068

71-
The key to press. The supported values are available on [`Cypress.Keyboard.Keys`](/api/cypress-api/keyboard-api), and may change from time to time. It's recomended that you reference these values from `Cypress.Keyboard.Keys` rather than passing in a string.
72-
73-
### Supported Keys
74-
75-
| Reference | Value |
76-
| --------------------------- | ------- |
77-
| `Cypress.Keyboard.Keys.TAB` | `"Tab"` |
69+
The key to press. Values for non single character keys are available on [`Cypress.Keyboard.Keys`](/api/cypress-api/keyboard-api), and may change from time to time. It's recommended that you reference these values from `Cypress.Keyboard.Keys` rather than passing in a string when available.
70+
71+
#### Supported Keys
72+
73+
| Reference | Value |
74+
| --------------------------------- | -------------------------------------------------------------------- |
75+
| Letters | `"a"` through `"z"`, `"A"` through `"Z"` |
76+
| Numbers | `"0"`, `"1"`, `"2"`, `"3"`, `"4"`, `"5"`, `"6"`, `"7"`, `"8"`, `"9"` |
77+
| Special Characters | `"!"`, `"@"`, `"#"`, `'+'`, `"€"`, `"é"`, etc. |
78+
| `Cypress.Keyboard.Keys.DOWN` | `"ArrowDown"` |
79+
| `Cypress.Keyboard.Keys.LEFT` | `"ArrowLeft"` |
80+
| `Cypress.Keyboard.Keys.RIGHT` | `"ArrowRight"` |
81+
| `Cypress.Keyboard.Keys.UP` | `"ArrowUp"` |
82+
| `Cypress.Keyboard.Keys.END` | `"End"` |
83+
| `Cypress.Keyboard.Keys.HOME` | `"Home"` |
84+
| `Cypress.Keyboard.Keys.PAGEDOWN` | `"PageDown"` |
85+
| `Cypress.Keyboard.Keys.PAGEUP` | `"PageUp"` |
86+
| `Cypress.Keyboard.Keys.ENTER` | `"Enter"` |
87+
| `Cypress.Keyboard.Keys.TAB` | `"Tab"` |
88+
| `Cypress.Keyboard.Keys.BACKSPACE` | `"Backspace"` |
89+
| `Cypress.Keyboard.Keys.DELETE` | `"Delete"` |
90+
| `Cypress.Keyboard.Keys.INSERT` | `"Insert"` |
91+
| `Cypress.Keyboard.Keys.F1` | `"F1"` |
92+
| `Cypress.Keyboard.Keys.F2` | `"F2"` |
93+
| `Cypress.Keyboard.Keys.F3` | `"F3"` |
94+
| `Cypress.Keyboard.Keys.F4` | `"F4"` |
95+
| `Cypress.Keyboard.Keys.F5` | `"F5"` |
96+
| `Cypress.Keyboard.Keys.F6` | `"F6"` |
97+
| `Cypress.Keyboard.Keys.F7` | `"F7"` |
98+
| `Cypress.Keyboard.Keys.F8` | `"F8"` |
99+
| `Cypress.Keyboard.Keys.F9` | `"F9"` |
100+
| `Cypress.Keyboard.Keys.F10` | `"F10"` |
101+
| `Cypress.Keyboard.Keys.F11` | `"F11"` |
102+
| `Cypress.Keyboard.Keys.F12` | `"F12"` |
78103

79104
<Icon name="angle-right" /> **options _(Object)_**
80105

@@ -112,19 +137,62 @@ it('autocompletes search input when pressing Tab', () => {
112137
})
113138
```
114139

140+
### Type a single character
141+
142+
Single character keys are supported, like `a`, `b`, `c`, etc. There is no need to reference `Cypress.Keyboard.Keys` record for these keys, just type them normally as a string:
143+
144+
```javascript
145+
cy.get('input').focus()
146+
cy.press('a')
147+
```
148+
149+
### Type a multi-codepoint UTF-8 character
150+
151+
Multi-codepoint UTF-8 characters are also supported and do not need to be entered as individual codepoints. For example, `é` can be either one single codepoint or two separate codepoints when the accent is pressed as a subsequent modifier key. You do not need to press each codepoint separately; just type the entire character as a string.
152+
153+
```javascript
154+
// works
155+
cy.get('input').focus()
156+
cy.press('é') // \u00e9 (composed é)
157+
cy.press('') // \u0065\u0301 (e + combining acute accent)
158+
159+
// also fine, but not necessary
160+
cy.get('input').focus()
161+
cy.press('e') // \u0065
162+
cy.press('́') // \u0301 (combining acute accent)
163+
```
164+
115165
## Notes
116166

167+
### Strings with multiple characters
168+
169+
Strings with multiple characters are not supported. If you need to input longer strings into a text input or similar, use [`cy.type()`](/api/commands/type).
170+
171+
```js
172+
cy.get('input').type('Hello, World') // Type 'Hello, World' into the 'input'
173+
```
174+
117175
### Transient activation
118176

119177
By dispatching native keyboard events to the browser, this command will cause the browser to enter [Transient activation](https://developer.mozilla.org/en-US/docs/Glossary/Transient_activation) state.
120178

121179
If your application prevents the default behavior of the `beforeunload` event, this may cause issues when navigating away from the current page.
122180

181+
### Firefox F6 key
182+
183+
In Firefox, [the F6 key is used to change focus to the next frame](https://support.mozilla.org/en-US/kb/keyboard-shortcuts-perform-firefox-tasks-quickly#w_current-page).
184+
Pressing F6 via `cy.press()` will dispatch the initial `keydown` appropriately, but
185+
due to the focus change, the `keyup` event will not be dispatched to the iframe containing
186+
the application under test.
187+
188+
To re-focus the iframe after pressing F6, use [`cy.focus()`](/api/commands/focus).
189+
123190
## History
124191

125-
| Version | Changes |
126-
| ----------------------------------- | ---------------------------- |
127-
| [14.3.0](/app/references/changelog) | Added the `.press()` command |
192+
| Version | Changes |
193+
| ----------------------------------- | ----------------------------------------------------------------------------------- |
194+
| [14.3.0](/app/references/changelog) | Added the `.press()` command |
195+
| [15.1.0](/app/references/changelog) | Expanded support to include named keys and single+multi-codepoint UTF-8 characters. |
128196

129197
## See also
130198

0 commit comments

Comments
 (0)