Skip to content

Commit

Permalink
add shadow dom support
Browse files Browse the repository at this point in the history
  • Loading branch information
mohsinulhaq committed May 25, 2021
1 parent 575662a commit 83b162e
Show file tree
Hide file tree
Showing 5 changed files with 547 additions and 425 deletions.
6 changes: 3 additions & 3 deletions .size-snapshot.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
{
"react-popper-tooltip.js": {
"bundled": 10837,
"minified": 5193,
"gzipped": 1733,
"bundled": 10999,
"minified": 5259,
"gzipped": 1763,
"treeshaked": {
"rollup": {
"code": 142,
Expand Down
28 changes: 14 additions & 14 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "react-popper-tooltip",
"version": "4.2.0",
"version": "4.3.0",
"description": "React tooltip library built around react-popper",
"author": "Mohsin Ul Haq <mohsinulhaq01@gmail.com>",
"license": "MIT",
Expand Down Expand Up @@ -33,7 +33,7 @@
"typecheck": "tsc --noEmit",
"lint": "eslint \"{src,tests,examples}**/*.{ts,tsx}\"",
"start": "rollup -c -w",
"test": "jest tests/",
"test": "jest --env=jsdom tests",
"storybook": "start-storybook -p 6006",
"build-storybook": "build-storybook",
"postinstall": "husky install",
Expand Down Expand Up @@ -64,25 +64,25 @@
"react-popper": "^2.2.5"
},
"devDependencies": {
"@babel/core": "^7.14.0",
"@babel/plugin-transform-runtime": "^7.13.15",
"@babel/preset-env": "^7.14.1",
"@babel/core": "^7.14.3",
"@babel/plugin-transform-runtime": "^7.14.3",
"@babel/preset-env": "^7.14.2",
"@babel/preset-react": "^7.13.13",
"@babel/preset-typescript": "^7.13.0",
"@storybook/addon-actions": "^6.2.9",
"@storybook/addon-essentials": "^6.2.9",
"@storybook/addon-links": "^6.2.9",
"@storybook/react": "^6.2.9",
"@testing-library/jest-dom": "^5.12.0",
"@testing-library/react": "^11.2.6",
"@testing-library/user-event": "^13.1.8",
"@testing-library/react": "^11.2.7",
"@testing-library/user-event": "^13.1.9",
"@types/jest": "^26.0.23",
"@types/react": "^17.0.5",
"@types/react-dom": "^17.0.3",
"@typescript-eslint/eslint-plugin": "^4.22.1",
"@typescript-eslint/parser": "^4.22.1",
"@types/react": "^17.0.7",
"@types/react-dom": "^17.0.5",
"@typescript-eslint/eslint-plugin": "^4.25.0",
"@typescript-eslint/parser": "^4.25.0",
"babel-loader": "^8.2.2",
"eslint": "^7.26.0",
"eslint": "^7.27.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-react": "^7.23.2",
Expand All @@ -91,10 +91,10 @@
"jest": "^26.6.3",
"lint-staged": "^11.0.0",
"pinst": "^2.1.6",
"prettier": "^2.2.1",
"prettier": "^2.3.0",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"rollup": "^2.47.0",
"rollup": "^2.50.0",
"rollup-plugin-babel": "^4.4.0",
"rollup-plugin-node-resolve": "^5.2.0",
"rollup-plugin-size-snapshot": "^0.12.0",
Expand Down
8 changes: 4 additions & 4 deletions src/usePopperTooltip.ts
Original file line number Diff line number Diff line change
Expand Up @@ -35,9 +35,9 @@ export function usePopperTooltip(
// Merging options with default options.
// Keys with undefined values are replaced with the default ones if any.
// Keys with other values pass through.
const finalConfig = (Object.keys(defaultConfig) as Array<
keyof typeof defaultConfig
>).reduce(
const finalConfig = (
Object.keys(defaultConfig) as Array<keyof typeof defaultConfig>
).reduce(
(config, key) => ({
...config,
[key]: config[key] !== undefined ? config[key] : defaultConfig[key],
Expand Down Expand Up @@ -125,7 +125,7 @@ export function usePopperTooltip(

const handleClickOutside: EventListener = (event) => {
const { tooltipRef, triggerRef } = getLatest();
const target = event.target;
const target = event.composedPath?.()?.[0] || event.target;
if (target instanceof Node) {
if (
tooltipRef != null &&
Expand Down
15 changes: 14 additions & 1 deletion tests/usePopperTooltip.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ describe('trigger option', () => {
});

test('closeOnOutsideClick removes tooltip on document.body click', async () => {
render(<Tooltip options={{ closeOnOutsideClick: true, trigger: 'click' }} />);
render(<Tooltip options={{ trigger: 'click' }} />);

// Show on click
userEvent.click(screen.getByText(TriggerText));
Expand All @@ -168,6 +168,19 @@ test('closeOnOutsideClick removes tooltip on document.body click', async () => {
});
});

test("closeOnOutsideClick doesn't remove tooltip on tooltip click", async () => {
render(<Tooltip options={{ trigger: 'click' }} />);

// Show on click
userEvent.click(screen.getByText(TriggerText));
expect(await screen.findByText(TooltipText)).toBeInTheDocument();

userEvent.click(screen.getByText(TooltipText));
await waitFor(() => {
expect(screen.queryByText(TooltipText)).toBeInTheDocument();
});
});

test('delayShow option renders tooltip after specified delay', async () => {
jest.useFakeTimers();
render(<Tooltip options={{ delayShow: 5000 }} />);
Expand Down
Loading

0 comments on commit 83b162e

Please sign in to comment.