Fix clicks do not work anymore

This commit is contained in:
Charles Bochet
2023-07-17 19:15:47 -07:00
parent a972705ce6
commit 9895c1d5d6
3 changed files with 7 additions and 9 deletions

View File

@ -28,12 +28,12 @@ test('useListenClickOutsideArrayOfRef hook works in dom mode', async () => {
const inside2 = getByText('Inside 2'); const inside2 = getByText('Inside 2');
const outside = getByText('Outside'); const outside = getByText('Outside');
fireEvent.click(inside); fireEvent.mouseUp(inside);
expect(onOutsideClick).toHaveBeenCalledTimes(0); expect(onOutsideClick).toHaveBeenCalledTimes(0);
fireEvent.click(inside2); fireEvent.mouseUp(inside2);
expect(onOutsideClick).toHaveBeenCalledTimes(0); expect(onOutsideClick).toHaveBeenCalledTimes(0);
fireEvent.click(outside); fireEvent.mouseUp(outside);
expect(onOutsideClick).toHaveBeenCalledTimes(1); expect(onOutsideClick).toHaveBeenCalledTimes(1);
}); });

View File

@ -43,8 +43,6 @@ export function useListenClickOutsideArrayOfRef<T extends Element>({
const clientY = const clientY =
'clientY' in event ? event.clientY : event.touches[0].clientY; 'clientY' in event ? event.clientY : event.touches[0].clientY;
console.log(clientX, clientY, x, y, width, height);
if ( if (
clientX < x || clientX < x ||
clientX > x + width || clientX > x + width ||
@ -64,12 +62,12 @@ export function useListenClickOutsideArrayOfRef<T extends Element>({
const hasAtLeastOneRefDefined = refs.some((ref) => isDefined(ref.current)); const hasAtLeastOneRefDefined = refs.some((ref) => isDefined(ref.current));
if (hasAtLeastOneRefDefined) { if (hasAtLeastOneRefDefined) {
document.addEventListener('click', handleClickOutside); document.addEventListener('mouseup', handleClickOutside);
document.addEventListener('touchend', handleClickOutside); document.addEventListener('touchend', handleClickOutside);
} }
return () => { return () => {
document.removeEventListener('click', handleClickOutside); document.removeEventListener('mouseup', handleClickOutside);
document.removeEventListener('touchend', handleClickOutside); document.removeEventListener('touchend', handleClickOutside);
}; };
}, [refs, callback, mode]); }, [refs, callback, mode]);

View File

@ -1,7 +1,7 @@
import { getOperationName } from '@apollo/client/utilities'; import { getOperationName } from '@apollo/client/utilities';
import { expect } from '@storybook/jest'; import { expect } from '@storybook/jest';
import type { Meta, StoryObj } from '@storybook/react'; import type { Meta, StoryObj } from '@storybook/react';
import { within } from '@storybook/testing-library'; import { fireEvent, within } from '@storybook/testing-library';
import { graphql } from 'msw'; import { graphql } from 'msw';
import { import {
@ -71,7 +71,7 @@ export const EditNote: Story = {
).toBeInTheDocument(); ).toBeInTheDocument();
const workspaceName = await canvas.findByText('Twenty'); const workspaceName = await canvas.findByText('Twenty');
await workspaceName.click(); await fireEvent.mouseUp(workspaceName);
expect(await canvas.queryByDisplayValue('My very first note')).toBeNull(); expect(await canvas.queryByDisplayValue('My very first note')).toBeNull();