Fix clicks do not work anymore
This commit is contained in:
@ -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);
|
||||||
});
|
});
|
||||||
|
|||||||
@ -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]);
|
||||||
|
|||||||
@ -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();
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user