From 4279f05c236ce91ae9291cc19cc83f31e75cabb0 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Fri, 20 Sep 2024 22:57:30 +0000 Subject: [PATCH] Temporary fix for a bug with Chrome 129 when handling mask-image (#8274) * Temporary fix for a bug with Chrome 129 when handling mask-image Signed-off-by: Miki * Changeset file for PR #8274 created/updated --------- Signed-off-by: Miki Co-authored-by: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com> (cherry picked from commit cd6a9095f20b4d8c1664e02609ed985a4aae83b3) Signed-off-by: github-actions[bot] --- changelogs/fragments/8274.yml | 2 ++ src/core/public/styles/_base.scss | 28 ++++++++++++++++++++++++++++ 2 files changed, 30 insertions(+) create mode 100644 changelogs/fragments/8274.yml diff --git a/changelogs/fragments/8274.yml b/changelogs/fragments/8274.yml new file mode 100644 index 00000000000..a8f25a5bd51 --- /dev/null +++ b/changelogs/fragments/8274.yml @@ -0,0 +1,2 @@ +fix: +- Add a temporary fix for a bug with Chrome 129 when handling mask-image ([#8274](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8274)) \ No newline at end of file diff --git a/src/core/public/styles/_base.scss b/src/core/public/styles/_base.scss index 24e3bfb8a59..e3b92e86144 100644 --- a/src/core/public/styles/_base.scss +++ b/src/core/public/styles/_base.scss @@ -63,3 +63,31 @@ $euiCollapsibleNavWidth: $euiSize * 20; height: auto; width: auto; } + +// Temporary fix for a bug with Chrome 129 when handling mask-image +// OUI provides the mask-image used in these which Chrome 129 fails to render correctly. +// It is not known if or when Chrome will fix this. Since almost all of these classes +// are applied to elements with scrollbars where their content contained, containing the +// paint is a safe solution. +// This can be achieved with various tricks like transform: translate?(0) or +// transform-style: preserve-3d but they add to the browsers workload; contain doesn't. +// ToDo: Remove these when most used versions of Chrome no longer suffer from the bug. +// From OUI: any ruleset containing mask-image +.eui-yScrollWithShadows, +.eui-xScrollWithShadows, +.euiYScrollWithShadows, +.euiDataGrid__controlScroll, +.euiDataGridColumnSelector__columnList, +.euiDataGridColumnSorting__fieldList, +.euiFlyoutBody .euiFlyoutBody__overflow, +.euiFlyoutBody .euiFlyoutBody__overflow.euiFlyoutBody__overflow--hasBanner, +.euiModalBody .euiModalBody__overflow, +.euiSelectableList__list, +// For OSD: consumers of eui?ScrollWithShadows +.osdQueryBar__textarea:not(:focus):not(:invalid), +.osdSavedQueryManagement__list, +.dscCanvas, +.vbConfig, +.vbSidenav__style { + contain: paint; +}