Skip to content

Commit 3c4d860

Browse files
Merge pull request #5315 from dshster/fix-disallowed-onfocus
Fix condition preventing props.onFocus execution
2 parents e9c00a9 + 1285af4 commit 3c4d860

File tree

2 files changed

+32
-2
lines changed

2 files changed

+32
-2
lines changed

src/index.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -515,9 +515,13 @@ export default class DatePicker extends Component<
515515
this.resetHiddenStatus();
516516
}
517517

518-
if (!this.state.preventFocus && isOpenAllowed) {
518+
if (!this.state.preventFocus) {
519519
this.props.onFocus?.(event);
520-
if (!this.props.preventOpenOnFocus && !this.props.readOnly) {
520+
if (
521+
isOpenAllowed &&
522+
!this.props.preventOpenOnFocus &&
523+
!this.props.readOnly
524+
) {
521525
this.setOpen(true);
522526
}
523527
}

src/test/datepicker_test.test.tsx

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -119,6 +119,32 @@ describe("DatePicker", () => {
119119
expect(container.querySelector(".react-datepicker")).toBeFalsy();
120120
});
121121

122+
it("should be executed props.onFocus on input focus when the document visibility changes", () => {
123+
const onFocusSpy = jest.fn();
124+
125+
const { container } = render(<DatePicker onFocus={onFocusSpy} />);
126+
127+
const input = safeQuerySelector<HTMLInputElement>(container, "input");
128+
129+
fireEvent.focus(input);
130+
expect(onFocusSpy).toHaveBeenCalled();
131+
132+
expect(container.querySelector(".react-datepicker")).toBeTruthy();
133+
fireEvent.keyDown(input, getKey(KeyType.Escape));
134+
fireEvent.blur(input);
135+
expect(container.querySelector(".react-datepicker")).toBeFalsy();
136+
137+
hideDocument(input);
138+
showDocument(input);
139+
140+
expect(onFocusSpy).toHaveBeenCalled();
141+
expect(container.querySelector(".react-datepicker")).toBeFalsy();
142+
143+
fireEvent.click(input);
144+
expect(onFocusSpy).toHaveBeenCalled();
145+
expect(container.querySelector(".react-datepicker")).toBeTruthy();
146+
});
147+
122148
it("should show the calendar when focusing on the date input", () => {
123149
const { container } = render(<DatePicker />);
124150

0 commit comments

Comments
 (0)