Problem with using v14 for keyboard behaviour to replicate pressing tab in the browser

[kksy]

Reproduction example

https://codesandbox.io/s/ecstatic-rubin-yygg77?file=/src/App.spec.js

Prerequisites

1. Go to the codesandbox link and press the "Test" tab

Expected behavior

Button element should have focus. This works when using version 13.5.0 userEvent.tab()

Actual behavior

Button does not have focus or is not the active element in the page

User-event version

14.4.1

Environment

Testing Library framework: @testing-library/react@13.3.0

JS framework: react@18.0.0

Test environment: jest sandbox version

DOM implementation: jsdom sandbox version

Additional context

I believe that this missing feature prevents us from testing keyboard accessibility in an easy way

[ph-fritsche]

Looks like a duplicate of #1002

[robin-hg]

Works for me in 14.3.0
Broken in 14.4.0+

[kksy]

I've just realised the implementation of tab is using the keyboard API under the hood. You're right @robinh-jsx. I tried it again locally and userEvent.tab() works in 13.5.0 and 14.3.0. userEvent.keyboard('{Tab}') never worked with focus even at 13.5.0 though.

According to the documentation, it also implies that both the keyboard('{Tab}') and tab should work the same

[ph-fritsche]

@kksy fixed your test: https://codesandbox.io/s/flamboyant-liskov-kcccjd?file=/src/App.spec.js
Working as expected

[ph-fritsche]

Works for me in 14.3.0 Broken in 14.4.0+

@robinh-jsx Could you provide more information, maybe a reproduction example? There was no particular change to either handling of Tab or how an element was focused. Might be unrelated.

[kksy]

Thanks @ph-fritsche I completely missed the Promise return. Regarding @robinh-jsx comment, user.tab works without await in 14.3.0, but you need await in 14.4.0. However, this is not mentioned in the documentation that it returns a Promise

[ph-fritsche]

All APIs in v14 return a Promise.
fixed in testing-library/testing-library-docs#1128

[ph-fritsche]

@all-contributors add @kksy docs

[allcontributors]

@ph-fritsche

I've put up a pull request to add @kksy! 🎉