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

fix(TooltipPopoverWrapper) Touch not opening popover on mobile (#1425) #1426

Merged
merged 3 commits into from Mar 20, 2019
Merged

fix(TooltipPopoverWrapper) Touch not opening popover on mobile (#1425) #1426

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
76ff422
Fix touch not opening popover on mobile (#1425)
hsource Mar 5, 2019
bef36ff
Merge branch 'master' into fix-mobile-popover-touch
hsource Mar 5, 2019
64442f5
Merge branch 'master' into fix-mobile-popover-touch
TheSharpieOne Mar 20, 2019
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
8 changes: 2 additions & 6 deletions src/TooltipPopoverWrapper.js
View file
Open in desktop
Expand Up @@ -222,9 +222,7 @@ class TooltipPopoverWrapper extends React.Component {
let triggers = this.props.trigger.split(' ');
if (triggers.indexOf('manual') === -1) {
if (triggers.indexOf('click') > -1 || triggers.indexOf('legacy') > -1) {
['click', 'touchstart'].forEach(event =>
document.addEventListener(event, this.handleDocumentClick, true)
);
document.addEventListener('click', this.handleDocumentClick, true);
}

if (this._target) {
Expand Down Expand Up @@ -267,9 +265,7 @@ class TooltipPopoverWrapper extends React.Component {
this._target.removeEventListener('focusout', this.hide, true);
}

['click', 'touchstart'].forEach(event =>
document.removeEventListener(event, this.handleDocumentClick, true)
);
document.removeEventListener('click', this.handleDocumentClick, true)
}

updateTarget() {
Expand Down
38 changes: 38 additions & 0 deletions src/__tests__/TooltipPopoverWrapper.spec.js
View file
Open in desktop
Expand Up @@ -229,6 +229,44 @@ describe('Tooltip', () => {
wrapper.detach();
});

it('should open after receiving single touchstart and single click', () => {
const wrapper = mount(
<TooltipPopoverWrapper target="target" isOpen={isOpen} toggle={toggle} trigger="click">
Tooltip Content
</TooltipPopoverWrapper>,
{ attachTo: container }
);

expect(isOpen).toBe(false);
target.dispatchEvent(new Event('touchstart'));
jest.runTimersToTime(20);
target.dispatchEvent(new Event('click'));
jest.runTimersToTime(200);
expect(isOpen).toBe(true);

wrapper.detach();
});

it('should close after receiving single touchstart and single click', () => {
isOpen = true;

const wrapper = mount(
<TooltipPopoverWrapper target="target" isOpen={isOpen} toggle={toggle} trigger="click">
Tooltip Content
</TooltipPopoverWrapper>,
{ attachTo: container }
);

expect(isOpen).toBe(true);
target.dispatchEvent(new Event('touchstart'));
jest.runTimersToTime(20);
target.dispatchEvent(new Event('click'));
jest.runTimersToTime(200);
expect(isOpen).toBe(false);

wrapper.detach();
});

it('should pass down custom modifiers', () => {
const wrapper = mount(
<TooltipPopoverWrapper
Expand Down