From 8c45ec5259057860156f19759aca88b9ea7a2a41 Mon Sep 17 00:00:00 2001 From: Voakie Date: Sat, 4 Jul 2020 15:45:50 +0200 Subject: [PATCH 1/3] Fix resizing on mobile --- package.json | 2 +- src/index.tsx | 13 ++++++++++++- yarn.lock | 8 ++++---- 3 files changed, 17 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 244b703de..b560a62cb 100644 --- a/package.json +++ b/package.json @@ -104,6 +104,6 @@ "fixture": "./test/fixture.html" }, "dependencies": { - "fast-memoize": "^2.5.1" + "fast-memoize": "^2.5.2" } } diff --git a/src/index.tsx b/src/index.tsx index 25fe2ad82..c53c94597 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -460,7 +460,10 @@ export class Resizable extends React.PureComponent { this.window.addEventListener('mouseup', this.onMouseUp); this.window.addEventListener('mousemove', this.onMouseMove); this.window.addEventListener('mouseleave', this.onMouseUp); - this.window.addEventListener('touchmove', this.onMouseMove); + this.window.addEventListener('touchmove', this.onMouseMove, { + capture: true, + passive: false, + }); this.window.addEventListener('touchend', this.onMouseUp); } } @@ -727,6 +730,14 @@ export class Resizable extends React.PureComponent { if (!this.state.isResizing || !this.resizable || !this.window) { return; } + if (event instanceof TouchEvent) { + try { + event.preventDefault(); + event.stopPropagation(); + } catch (e) { + // Ignore on fail + } + } let { maxWidth, maxHeight, minWidth, minHeight } = this.props; const clientX = event instanceof this.window.MouseEvent ? event.clientX : event.touches[0].clientX; const clientY = event instanceof this.window.MouseEvent ? event.clientY : event.touches[0].clientY; diff --git a/yarn.lock b/yarn.lock index b1ca181fd..9f47a5b09 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6792,10 +6792,10 @@ fast-json-stable-stringify@^2.0.0: resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz#d5142c0caee6b1189f87d3a76111064f86c8bbf2" integrity sha1-1RQsDK7msRifh9OnYREGT4bIu/I= -fast-memoize@^2.5.1: - version "2.5.1" - resolved "https://registry.yarnpkg.com/fast-memoize/-/fast-memoize-2.5.1.tgz#c3519241e80552ce395e1a32dcdde8d1fd680f5d" - integrity sha512-xdmw296PCL01tMOXx9mdJSmWY29jQgxyuZdq0rEHMu+Tpe1eOEtCycoG6chzlcrWsNgpZP7oL8RiQr7+G6Bl6g== +fast-memoize@^2.5.2: + version "2.5.2" + resolved "https://registry.yarnpkg.com/fast-memoize/-/fast-memoize-2.5.2.tgz#79e3bb6a4ec867ea40ba0e7146816f6cdce9b57e" + integrity sha512-Ue0LwpDYErFbmNnZSF0UH6eImUwDmogUO1jyE+JbN2gsQz/jICm1Ve7t9QT0rNSsfJt+Hs4/S3GnsDVjL4HVrw== fault@^1.0.2: version "1.0.3" From ca5bc8aecfd1821f3197f50d5ff244f2262982ca Mon Sep 17 00:00:00 2001 From: Voakie Date: Sat, 4 Jul 2020 15:59:16 +0200 Subject: [PATCH 2/3] Revert fast-memoize upgrade --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index b560a62cb..244b703de 100644 --- a/package.json +++ b/package.json @@ -104,6 +104,6 @@ "fixture": "./test/fixture.html" }, "dependencies": { - "fast-memoize": "^2.5.2" + "fast-memoize": "^2.5.1" } } diff --git a/yarn.lock b/yarn.lock index 9f47a5b09..b1ca181fd 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6792,10 +6792,10 @@ fast-json-stable-stringify@^2.0.0: resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz#d5142c0caee6b1189f87d3a76111064f86c8bbf2" integrity sha1-1RQsDK7msRifh9OnYREGT4bIu/I= -fast-memoize@^2.5.2: - version "2.5.2" - resolved "https://registry.yarnpkg.com/fast-memoize/-/fast-memoize-2.5.2.tgz#79e3bb6a4ec867ea40ba0e7146816f6cdce9b57e" - integrity sha512-Ue0LwpDYErFbmNnZSF0UH6eImUwDmogUO1jyE+JbN2gsQz/jICm1Ve7t9QT0rNSsfJt+Hs4/S3GnsDVjL4HVrw== +fast-memoize@^2.5.1: + version "2.5.1" + resolved "https://registry.yarnpkg.com/fast-memoize/-/fast-memoize-2.5.1.tgz#c3519241e80552ce395e1a32dcdde8d1fd680f5d" + integrity sha512-xdmw296PCL01tMOXx9mdJSmWY29jQgxyuZdq0rEHMu+Tpe1eOEtCycoG6chzlcrWsNgpZP7oL8RiQr7+G6Bl6g== fault@^1.0.2: version "1.0.3" From 7ed60fa7cca1c8a3a5071300b610328bb95d97e5 Mon Sep 17 00:00:00 2001 From: Voakie Date: Sun, 5 Jul 2020 17:22:16 +0200 Subject: [PATCH 3/3] Fix `removeEventListener` --- src/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.tsx b/src/index.tsx index c53c94597..233a1f4c0 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -473,7 +473,7 @@ export class Resizable extends React.PureComponent { this.window.removeEventListener('mouseup', this.onMouseUp); this.window.removeEventListener('mousemove', this.onMouseMove); this.window.removeEventListener('mouseleave', this.onMouseUp); - this.window.removeEventListener('touchmove', this.onMouseMove); + this.window.removeEventListener('touchmove', this.onMouseMove, true); this.window.removeEventListener('touchend', this.onMouseUp); } }