diff --git a/README.md b/README.md index 91428b0..d8b95ed 100644 --- a/README.md +++ b/README.md @@ -61,6 +61,7 @@ import {FocusOn} from 'react-focus-on'; - `[noIsolation]` - disables aria-hidden isolation - `[inert]` - enables pointer-events isolation (☠️ dangerous, use to disable "parent scrollbars", refer to [react-remove-scroll](https://github.com/theKashey/react-remove-scroll) documentation) - `[allowPinchZoom]` - enables "pinch-n-zoom" behavior. By default it might be prevented, refer to [react-remove-scroll](https://github.com/theKashey/react-remove-scroll) documentation + - `[preventScrollOnFocus]` - prevents a [side effect of a programatic page scroll](https://github.com/theKashey/react-focus-on/issues/62) caused by focusing elements. Especially useful to address modal animations. --- - `[onActivation]` - on activation callback - `[onDeactivation]` - on deactivation callback diff --git a/__tests__/UI.tsx b/__tests__/UI.tsx index 13569fe..3032f91 100644 --- a/__tests__/UI.tsx +++ b/__tests__/UI.tsx @@ -3,7 +3,6 @@ import {configure, mount} from 'enzyme'; import {FocusOn} from '../src/UI'; import {sidecar} from "use-sidecar"; import * as Adapter from 'enzyme-adapter-react-16'; -import {RemoveScroll} from "../../react-remove-scroll/src/UI"; configure({ adapter: new Adapter() }); diff --git a/__tests__/combination.tsx b/__tests__/combination.tsx index d8cafec..c3ef8d8 100644 --- a/__tests__/combination.tsx +++ b/__tests__/combination.tsx @@ -8,6 +8,9 @@ configure({adapter: new Adapter()}); const tick = () => new Promise(resolve => setTimeout(resolve, 10)); describe('Endpoint Combination', () => { + afterAll(() => { + document.body=''; + }) it('smoke', async () => { const onActivation = jest.fn(); const onDeactivation = jest.fn(); @@ -22,9 +25,11 @@ describe('Endpoint Combination', () => { ); - const wrapper = mount(); + const wrapper = mount(, {attachTo:document.body}); expect(wrapper.html()).toContain('content'); + expect(document.activeElement.innerHTML).toBe('button1'); + wrapper.setProps({enabled:true}); expect(document.body.className).toBe('block-interactivity-0'); await tick(); @@ -32,6 +37,7 @@ describe('Endpoint Combination', () => { expect(document.activeElement.innerHTML).toBe('button2'); wrapper.unmount(); + expect(onDeactivation).toHaveBeenCalled(); expect(document.body.className).toBe(''); await tick(); diff --git a/__tests__/smoke.tsx b/__tests__/smoke.tsx index 49817c5..b93f23a 100644 --- a/__tests__/smoke.tsx +++ b/__tests__/smoke.tsx @@ -1,6 +1,5 @@ describe('smoke', function () { it('requires UI', () => { - debugger; require('../src/UI'); }) }); \ No newline at end of file diff --git a/package.json b/package.json index cdf6b7d..f3ebbee 100644 --- a/package.json +++ b/package.json @@ -44,9 +44,9 @@ "ts-react-toolbox": "^0.2.10" }, "dependencies": { - "aria-hidden": "^1.1.3", - "react-focus-lock": "^2.9.0", - "react-remove-scroll": "^2.5.2", + "aria-hidden": "^1.2.2", + "react-focus-lock": "^2.9.2", + "react-remove-scroll": "^2.5.5", "react-style-singleton": "^2.2.0", "tslib": "^2.3.1", "use-callback-ref": "^1.3.0", diff --git a/yarn.lock b/yarn.lock index 4e9bb9a..e870570 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1028,12 +1028,12 @@ argparse@^1.0.7: dependencies: sprintf-js "~1.0.2" -aria-hidden@^1.1.3: - version "1.1.3" - resolved "https://registry.yarnpkg.com/aria-hidden/-/aria-hidden-1.1.3.tgz#bb48de18dc84787a3c6eee113709c473c64ec254" - integrity sha512-RhVWFtKH5BiGMycI72q2RAFMLQi8JP9bLuQXgR5a8Znp7P5KOIADSJeyfI8PCVxLEp067B2HbP5JIiI/PXIZeA== +aria-hidden@^1.2.2: + version "1.2.2" + resolved "https://packages.atlassian.com/api/npm/npm-remote/aria-hidden/-/aria-hidden-1.2.2.tgz#8c4f7cc88d73ca42114106fdf6f47e68d31475b8" + integrity sha512-6y/ogyDTk/7YAe91T3E2PR1ALVKyM2QbTio5HwM+N1Q6CMlCKhvClyIjkckBswa0f2xJhjsfzIGa1yVSe1UMVA== dependencies: - tslib "^1.0.0" + tslib "^2.0.0" aria-query@^3.0.0: version "3.0.0" @@ -4547,10 +4547,10 @@ flush-write-stream@^1.0.0: inherits "^2.0.1" readable-stream "^2.0.4" -focus-lock@^0.11.0: - version "0.11.0" - resolved "https://registry.yarnpkg.com/focus-lock/-/focus-lock-0.11.0.tgz#72f9055d34fff59d54aec8e602adbb5438108709" - integrity sha512-7tCIkCdnMEnqwEWr3PktH8wA/SAcIPlhrDuLg+o20DjZ/fZW/rIy7Tc9BC2kJBOttH4vbzTXqte5PL8babatBw== +focus-lock@^0.11.2: + version "0.11.3" + resolved "https://packages.atlassian.com/api/npm/npm-remote/focus-lock/-/focus-lock-0.11.3.tgz#c094e8f109d780f56038abdeec79328fd56b627f" + integrity sha512-4n0pYcPTa/uI7Q66BZna61nRT7lDhnuJ9PJr6wiDjx4uStg491ks41y7uOG+s0umaaa+hulNKSldU9aTg9/yVg== dependencies: tslib "^2.0.3" @@ -8454,10 +8454,10 @@ raw-body@2.3.3: iconv-lite "0.4.23" unpipe "1.0.0" -react-clientside-effect@^1.2.5: - version "1.2.5" - resolved "https://registry.yarnpkg.com/react-clientside-effect/-/react-clientside-effect-1.2.5.tgz#e2c4dc3c9ee109f642fac4f5b6e9bf5bcd2219a3" - integrity sha512-2bL8qFW1TGBHozGGbVeyvnggRpMjibeZM2536AKNENLECutp2yfs44IL8Hmpn8qjFQ2K7A9PnYf3vc7aQq/cPA== +react-clientside-effect@^1.2.6: + version "1.2.6" + resolved "https://packages.atlassian.com/api/npm/npm-remote/react-clientside-effect/-/react-clientside-effect-1.2.6.tgz#29f9b14e944a376b03fb650eed2a754dd128ea3a" + integrity sha512-XGGGRQAKY+q25Lz9a/4EPqom7WRjz3z9R2k4jhVKA/puQFH/5Nt27vFZYql4m4NVNdUvX8PS3O7r/Zzm7cjUlg== dependencies: "@babel/runtime" "^7.12.13" @@ -8481,15 +8481,15 @@ react-dom@^16.8.6: prop-types "^15.6.2" scheduler "^0.13.6" -react-focus-lock@^2.9.0: - version "2.9.0" - resolved "https://registry.yarnpkg.com/react-focus-lock/-/react-focus-lock-2.9.0.tgz#c148fcadb78cc86968c722b0ed7369aa45585f1c" - integrity sha512-MF4uqKm77jkz1gn5t2BAnHeWWsDevZofrCxp2utDls0FX7pW/F1cn7Xi7pSpnqxCP1JL2okS8tcFEFIfzjJcIw== +react-focus-lock@^2.9.2: + version "2.9.2" + resolved "https://packages.atlassian.com/api/npm/npm-remote/react-focus-lock/-/react-focus-lock-2.9.2.tgz#a57dfd7c493e5a030d87f161c96ffd082bd920f2" + integrity sha512-5JfrsOKyA5Zn3h958mk7bAcfphr24jPoMoznJ8vaJF6fUrPQ8zrtEd3ILLOK8P5jvGxdMd96OxWNjDzATfR2qw== dependencies: "@babel/runtime" "^7.0.0" - focus-lock "^0.11.0" + focus-lock "^0.11.2" prop-types "^15.6.2" - react-clientside-effect "^1.2.5" + react-clientside-effect "^1.2.6" use-callback-ref "^1.3.0" use-sidecar "^1.1.2" @@ -8525,22 +8525,22 @@ react-powerplug@^1.0.0: dependencies: "@babel/runtime" "^7.0.0" -react-remove-scroll-bar@^2.3.0: - version "2.3.1" - resolved "https://registry.yarnpkg.com/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.1.tgz#9f13b05b249eaa57c8d646c1ebb83006b3581f5f" - integrity sha512-IvGX3mJclEF7+hga8APZczve1UyGMkMG+tjS0o/U1iLgvZRpjFAQEUBJ4JETfvbNlfNnZnoDyWJCICkA15Mghg== +react-remove-scroll-bar@^2.3.3: + version "2.3.4" + resolved "https://packages.atlassian.com/api/npm/npm-remote/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.4.tgz#53e272d7a5cb8242990c7f144c44d8bd8ab5afd9" + integrity sha512-63C4YQBUt0m6ALadE9XV56hV8BgJWDmmTPY758iIJjfQKt2nYwoUrPk0LXRXcB/yIj82T1/Ixfdpdk68LwIB0A== dependencies: - react-style-singleton "^2.2.0" + react-style-singleton "^2.2.1" tslib "^2.0.0" -react-remove-scroll@^2.5.2: - version "2.5.2" - resolved "https://registry.yarnpkg.com/react-remove-scroll/-/react-remove-scroll-2.5.2.tgz#9c402641ae3fadb35dbe560b5fd37aaef9bc676c" - integrity sha512-f8nbXX1QG9SzXilFUAopSLvbE9yyywkmgyxOUXDPv18XsOCPCYvBsLqB6hdFR47cD7A9a3xInNagvNziubfzRQ== +react-remove-scroll@^2.5.5: + version "2.5.5" + resolved "https://packages.atlassian.com/api/npm/npm-remote/react-remove-scroll/-/react-remove-scroll-2.5.5.tgz#1e31a1260df08887a8a0e46d09271b52b3a37e77" + integrity sha512-ImKhrzJJsyXJfBZ4bzu8Bwpka14c/fQt0k+cyFp/PBhTfyDnU5hjOtM4AG/0AMyy8oKzOTR0lDgJIM7pYXI0kw== dependencies: - react-remove-scroll-bar "^2.3.0" - react-style-singleton "^2.2.0" - tslib "^2.0.0" + react-remove-scroll-bar "^2.3.3" + react-style-singleton "^2.2.1" + tslib "^2.1.0" use-callback-ref "^1.3.0" use-sidecar "^1.1.2" @@ -8553,6 +8553,15 @@ react-style-singleton@^2.2.0: invariant "^2.2.4" tslib "^2.0.0" +react-style-singleton@^2.2.1: + version "2.2.1" + resolved "https://packages.atlassian.com/api/npm/npm-remote/react-style-singleton/-/react-style-singleton-2.2.1.tgz#f99e420492b2d8f34d38308ff660b60d0b1205b4" + integrity sha512-ZWj0fHEMyWkHzKYUr2Bs/4zU6XLmq9HsgBURm7g5pAVfyn49DgUiNgY2d4lXRlYSiCif9YBGpQleewkcqddc7g== + dependencies: + get-nonce "^1.0.0" + invariant "^2.2.4" + tslib "^2.0.0" + react-test-renderer@^16.0.0-0: version "16.5.2" resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.5.2.tgz#92e9d2c6f763b9821b2e0b22f994ee675068b5ae" @@ -10144,7 +10153,7 @@ ts-react-toolbox@^0.2.10: webpack-cli "^2.1.3" webpack-dev-server "^3.1.1" -tslib@^1.0.0, tslib@^1.8.0, tslib@^1.8.1, tslib@^1.9.0: +tslib@^1.8.0, tslib@^1.8.1, tslib@^1.9.0: version "1.9.3" resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.9.3.tgz#d7e4dd79245d85428c4d7e4822a79917954ca286" integrity sha512-4krF8scpejhaOgqzBEcGM7yDIEfi0/8+8zDRZhNZZ2kjmHJ4hv3zCbQWxoJGz1iw5U0Jl0nma13xzHXcncMavQ== @@ -10164,6 +10173,11 @@ tslib@^2.0.3, tslib@^2.3.1: resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.3.1.tgz#e8a335add5ceae51aa261d32a490158ef042ef01" integrity sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw== +tslib@^2.1.0: + version "2.4.1" + resolved "https://packages.atlassian.com/api/npm/npm-remote/tslib/-/tslib-2.4.1.tgz#0d0bfbaac2880b91e22df0768e55be9753a5b17e" + integrity sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA== + tslint-config-prettier@^1.10.0: version "1.15.0" resolved "https://registry.yarnpkg.com/tslint-config-prettier/-/tslint-config-prettier-1.15.0.tgz#76b9714399004ab6831fdcf76d89b73691c812cf"