Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Bugix/fire type events on active element #299

Merged
merged 10 commits into from Jun 4, 2020
Merged

Bugix/fire type events on active element #299

Changes from 4 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
ebd7701
fix: allow focus to change between type events
kayleighridd May 27, 2020
82b00f0
update fragement convention
kayleighridd May 27, 2020
06c660a
Merge branch 'master' into bugix/fire-type-events-on-active-element
kentcdodds Jun 2, 2020
08bed74
Update document.activeElement to use element.ownerDocument
kayleighridd Jun 3, 2020
dd708bf
Check element isn't disabled before firing events
kayleighridd Jun 3, 2020
9414e21
Add compute text function
kayleighridd Jun 4, 2020
87fbb2a
Rename actuallyTyped to currentValue
kayleighridd Jun 4, 2020
3ebc898
Simplify isTextPastThreshold check
kayleighridd Jun 4, 2020
85fa272
Fix function call
kayleighridd Jun 4, 2020
34ddb49
Correct typo
kayleighridd Jun 4, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
31 changes: 17 additions & 14 deletions src/index.js
View file
Open in desktop
Expand Up @@ -337,24 +337,27 @@ async function typeImpl(element, text, {allAtOnce = false, delay} = {}) {

element.focus()

// The focussed element could change between each event, so get the currently active element each time
const currentElement = () => element.ownerDocument.activeElement
const currentValue = () => element.ownerDocument.activeElement.value

const computeText = () =>
currentElement().maxLength > 0
? text.slice(
0,
Math.max(currentElement().maxLength - currentValue().length, 0),
)
: text

if (allAtOnce) {
if (!element.readOnly) {
const previousText = element.value

const computedText =
element.maxLength > 0
? text.slice(0, Math.max(element.maxLength - previousText.length, 0))
: text

fireEvent.input(element, {
target: {value: previousText + computedText},
target: {value: previousText + computeText()},
})
}
} else {
// The focussed element could change between each event, so get the currently active element each time
const currentElement = () => element.ownerDocument.activeElement
const actuallyTyped = () => element.ownerDocument.activeElement.value

for (let index = 0; index < text.length; index++) {
const char = text[index]
const key = char // TODO: check if this also valid for characters with diacritic markers e.g. úé etc
Expand All @@ -363,6 +366,8 @@ async function typeImpl(element, text, {allAtOnce = false, delay} = {}) {
// eslint-disable-next-line no-await-in-loop
if (delay > 0) await wait(delay)

if (currentElement.disabled) return
kayleighridd marked this conversation as resolved.
Show resolved Hide resolved

const downEvent = fireEvent.keyDown(currentElement(), {
key,
keyCode,
Expand All @@ -376,15 +381,13 @@ async function typeImpl(element, text, {allAtOnce = false, delay} = {}) {
charCode: keyCode,
})

const isTextPastThreshold =
(actuallyTyped() + key).length >
(currentElement().maxLength || text.length)
const isTextPastThreshold = !computeText().length

if (pressEvent && !isTextPastThreshold) {
if (!element.readOnly) {
fireEvent.input(currentElement(), {
target: {
value: actuallyTyped() + key,
value: currentValue() + key,
},
bubbles: true,
cancelable: true,
Expand Down