From 3ad4dc1547d4aa59dbac06aa9053760606406439 Mon Sep 17 00:00:00 2001 From: Alexa V <239999+axelavargas@users.noreply.github.com> Date: Thu, 30 Mar 2023 09:47:00 +0200 Subject: [PATCH] Dashboards: Fix Mobile support dashboard issues on new iOS 16.3 (#65542) --- .../src/components/CustomScrollbar/CustomScrollbar.tsx | 5 +++++ .../__snapshots__/CustomScrollbar.test.tsx.snap | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx b/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx index dc3f0ec21fc..2567be5b644 100644 --- a/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx +++ b/packages/grafana-ui/src/components/CustomScrollbar/CustomScrollbar.tsx @@ -111,6 +111,11 @@ export const CustomScrollbar = ({ }, []); const renderView = useCallback((passedProps: JSX.IntrinsicElements['div']) => { + // fixes issues of visibility on safari and ios devices + if (passedProps.style && passedProps.style['WebkitOverflowScrolling'] === 'touch') { + passedProps.style['WebkitOverflowScrolling'] = 'auto'; + } + return
; }, []); diff --git a/packages/grafana-ui/src/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap b/packages/grafana-ui/src/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap index 51bbeb3cb85..93495137aee 100644 --- a/packages/grafana-ui/src/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap +++ b/packages/grafana-ui/src/components/CustomScrollbar/__snapshots__/CustomScrollbar.test.tsx.snap @@ -18,7 +18,7 @@ exports[`CustomScrollbar renders correctly 1`] = ` className="scrollbar-view" style={ { - "WebkitOverflowScrolling": "touch", + "WebkitOverflowScrolling": "auto", "bottom": undefined, "left": undefined, "marginBottom": 0,