From 875122cd7a0c3859e325e734ac11507f63266876 Mon Sep 17 00:00:00 2001 From: Winn Date: Tue, 24 Mar 2020 21:08:10 -0400 Subject: [PATCH 1/5] Changed EuiMutationObserver to EuiResizeObserver Currently working in supported browers --- package.json | 3 ++- yarn.lock | 37 +++++++++++++++++++++++++++++++------ 2 files changed, 33 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 697df9919c2..9decdba40db 100644 --- a/package.json +++ b/package.json @@ -46,6 +46,7 @@ "test-staged" ], "dependencies": { + "@elastic/eui": "^21.1.0", "@types/chroma-js": "^2.0.0", "@types/enzyme": "^3.1.13", "@types/lodash": "^4.14.116", @@ -152,7 +153,7 @@ "jquery": "^3.2.1", "markdown-it": "8.4.1", "mocha": "^5.0.4", - "moment": "^2.20.1", + "moment": "^2.24.0", "moment-timezone": "^0.5.27", "node-sass": "^4.9.3", "nodegit": "^0.23.0", diff --git a/yarn.lock b/yarn.lock index c58987ced55..bd227bcbff8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1024,6 +1024,36 @@ resolved "https://registry.yarnpkg.com/@elastic/eslint-config-kibana/-/eslint-config-kibana-0.15.0.tgz#a552793497cdfc1829c2f9b7cd7018eb008f1606" integrity sha1-pVJ5NJfN/Bgpwvm3zXAY6wCPFgY= +"@elastic/eui@^21.1.0": + version "21.1.0" + resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-21.1.0.tgz#f9a9edc6f682c1a17f8394827c12d7dc57bac7bf" + integrity sha512-U6y/OjM3qfgSZusTVrtpGbYhKXh9bRLqy89JAVo/qrAzzchKCIur9P+AasVF1UG/bUDQEkkmgpNGutbe/BWrJg== + dependencies: + "@types/chroma-js" "^2.0.0" + "@types/enzyme" "^3.1.13" + "@types/lodash" "^4.14.116" + "@types/numeral" "^0.0.25" + "@types/react-beautiful-dnd" "^10.1.0" + "@types/react-input-autosize" "^2.0.2" + "@types/react-virtualized" "^9.18.7" + chroma-js "^2.0.4" + classnames "^2.2.5" + highlight.js "^9.12.0" + html "^1.0.0" + keymirror "^0.1.1" + lodash "^4.17.11" + numeral "^2.0.6" + prop-types "^15.6.0" + react-ace "^7.0.5" + react-beautiful-dnd "^10.1.0" + react-focus-lock "^1.17.7" + react-input-autosize "^2.2.2" + react-is "~16.3.0" + react-virtualized "^9.21.2" + resize-observer-polyfill "^1.5.0" + tabbable "^3.0.0" + uuid "^3.1.0" + "@sentry/core@4.2.4": version "4.2.4" resolved "https://registry.yarnpkg.com/@sentry/core/-/core-4.2.4.tgz#e4a331512a4db149f14a2976b75a5b3c8ef47f87" @@ -9703,16 +9733,11 @@ moment@2.x.x: resolved "https://registry.yarnpkg.com/moment/-/moment-2.21.0.tgz#2a114b51d2a6ec9e6d83cf803f838a878d8a023a" integrity sha512-TCZ36BjURTeFTM/CwRcViQlfkMvL1/vFISuNLO5GkcVm1+QHfbSiNqZuWeMFjj1/3+uAjXswgRk30j1kkLYJBQ== -"moment@>= 2.9.0": +"moment@>= 2.9.0", moment@^2.24.0: version "2.24.0" resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b" integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg== -moment@^2.20.1: - version "2.20.1" - resolved "https://registry.yarnpkg.com/moment/-/moment-2.20.1.tgz#d6eb1a46cbcc14a2b2f9434112c1ff8907f313fd" - integrity sha512-Yh9y73JRljxW5QxN08Fner68eFLxM5ynNOAw2LbIB1YAGeQzZT8QFSUvkAz609Zf+IHhhaUxqZK8dG3W/+HEvg== - monocle-ts@^1.0.0: version "1.7.2" resolved "https://registry.yarnpkg.com/monocle-ts/-/monocle-ts-1.7.2.tgz#d9825ae18846ab63f915cb6f2194a78a40025610" From 64a7fdf6382d5d00920de0cdf1e2cc767a1c8b4e Mon Sep 17 00:00:00 2001 From: Winn Date: Tue, 24 Mar 2020 21:13:20 -0400 Subject: [PATCH 2/5] Changed EuiMutationObserver to EuiResizeObserver Currently working in supported browers --- .../__snapshots__/accordion.test.tsx.snap | 30 ++++------------- src/components/accordion/accordion.tsx | 32 +++---------------- 2 files changed, 11 insertions(+), 51 deletions(-) diff --git a/src/components/accordion/__snapshots__/accordion.test.tsx.snap b/src/components/accordion/__snapshots__/accordion.test.tsx.snap index 4f49249582f..6288bdd006b 100644 --- a/src/components/accordion/__snapshots__/accordion.test.tsx.snap +++ b/src/components/accordion/__snapshots__/accordion.test.tsx.snap @@ -42,24 +42,15 @@ exports[`EuiAccordion behavior closes when clicked twice 1`] = ` className="euiAccordion__childWrapper" id="8" > -
- +
@@ -107,24 +98,15 @@ exports[`EuiAccordion behavior opens when clicked once 1`] = ` className="euiAccordion__childWrapper" id="7" > -
- +
diff --git a/src/components/accordion/accordion.tsx b/src/components/accordion/accordion.tsx index 54a052ad921..0a406188093 100644 --- a/src/components/accordion/accordion.tsx +++ b/src/components/accordion/accordion.tsx @@ -4,10 +4,7 @@ import classNames from 'classnames'; import { CommonProps, keysOf } from '../common'; import { EuiIcon } from '../icon'; -import { EuiMutationObserver } from '../observer/mutation_observer'; -import { getDurationAndPerformOnFrame } from '../../services'; - -const MUTATION_ATTRIBUTE_FILTER = ['style']; +import { EuiResizeObserver } from '../observer/resize_observer'; const paddingSizeToClassNameMap = { none: '', @@ -87,19 +84,6 @@ export class EuiAccordion extends Component< }); }; - onMutation = (records: MutationRecord[]) => { - const isChildStyleMutation = records.find((record: MutationRecord) => { - return record.attributeName - ? MUTATION_ATTRIBUTE_FILTER.indexOf(record.attributeName) > -1 - : false; - }); - if (isChildStyleMutation) { - getDurationAndPerformOnFrame(records, this.setChildContentHeight); - } else { - this.setChildContentHeight(); - } - }; - componentDidMount() { this.setChildContentHeight(); } @@ -201,23 +185,17 @@ export class EuiAccordion extends Component< this.childWrapper = node; }} id={id}> - - {mutationRef => ( + + {resizeRef => (
{ this.setChildContentRef(ref); - mutationRef(ref); + resizeRef(ref); }}>
{children}
)} - + ); From a365efd0d3e321ab85bbbc6f17b99b5dbd1a36e4 Mon Sep 17 00:00:00 2001 From: Winn Date: Wed, 25 Mar 2020 22:41:38 -0400 Subject: [PATCH 3/5] Logged in CHANGELOG.md --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index d1968950eda..9094a2a1726 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ **Bug Fixes** +- Fixed bug in `EuiAccordion` to adjust to the correct height when content height changes ([#3160](https://github.com/elastic/eui/pull/3160)) - Fixed bug in `EuiSuperDatePicker` to show correct values of commonly used values in relative tab ([#3106](https://github.com/elastic/eui/pull/3106)) - Fixed race condition in `EuiIcon` when switching from dynamically fetched components ([#3118](https://github.com/elastic/eui/pull/3118)) From 244f046697cb3b9bd437e9400c5f8e6f138ae441 Mon Sep 17 00:00:00 2001 From: Winn Date: Mon, 30 Mar 2020 16:02:40 -0400 Subject: [PATCH 4/5] Removed/modified dependencies --- package.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/package.json b/package.json index 9decdba40db..697df9919c2 100644 --- a/package.json +++ b/package.json @@ -46,7 +46,6 @@ "test-staged" ], "dependencies": { - "@elastic/eui": "^21.1.0", "@types/chroma-js": "^2.0.0", "@types/enzyme": "^3.1.13", "@types/lodash": "^4.14.116", @@ -153,7 +152,7 @@ "jquery": "^3.2.1", "markdown-it": "8.4.1", "mocha": "^5.0.4", - "moment": "^2.24.0", + "moment": "^2.20.1", "moment-timezone": "^0.5.27", "node-sass": "^4.9.3", "nodegit": "^0.23.0", From 6d050284f471a9f4139cca10b73a733aa5b39138 Mon Sep 17 00:00:00 2001 From: Winn Date: Mon, 30 Mar 2020 17:39:25 -0400 Subject: [PATCH 5/5] Modified yarn.lock file --- yarn.lock | 37 ++++++------------------------------- 1 file changed, 6 insertions(+), 31 deletions(-) diff --git a/yarn.lock b/yarn.lock index bd227bcbff8..c58987ced55 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1024,36 +1024,6 @@ resolved "https://registry.yarnpkg.com/@elastic/eslint-config-kibana/-/eslint-config-kibana-0.15.0.tgz#a552793497cdfc1829c2f9b7cd7018eb008f1606" integrity sha1-pVJ5NJfN/Bgpwvm3zXAY6wCPFgY= -"@elastic/eui@^21.1.0": - version "21.1.0" - resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-21.1.0.tgz#f9a9edc6f682c1a17f8394827c12d7dc57bac7bf" - integrity sha512-U6y/OjM3qfgSZusTVrtpGbYhKXh9bRLqy89JAVo/qrAzzchKCIur9P+AasVF1UG/bUDQEkkmgpNGutbe/BWrJg== - dependencies: - "@types/chroma-js" "^2.0.0" - "@types/enzyme" "^3.1.13" - "@types/lodash" "^4.14.116" - "@types/numeral" "^0.0.25" - "@types/react-beautiful-dnd" "^10.1.0" - "@types/react-input-autosize" "^2.0.2" - "@types/react-virtualized" "^9.18.7" - chroma-js "^2.0.4" - classnames "^2.2.5" - highlight.js "^9.12.0" - html "^1.0.0" - keymirror "^0.1.1" - lodash "^4.17.11" - numeral "^2.0.6" - prop-types "^15.6.0" - react-ace "^7.0.5" - react-beautiful-dnd "^10.1.0" - react-focus-lock "^1.17.7" - react-input-autosize "^2.2.2" - react-is "~16.3.0" - react-virtualized "^9.21.2" - resize-observer-polyfill "^1.5.0" - tabbable "^3.0.0" - uuid "^3.1.0" - "@sentry/core@4.2.4": version "4.2.4" resolved "https://registry.yarnpkg.com/@sentry/core/-/core-4.2.4.tgz#e4a331512a4db149f14a2976b75a5b3c8ef47f87" @@ -9733,11 +9703,16 @@ moment@2.x.x: resolved "https://registry.yarnpkg.com/moment/-/moment-2.21.0.tgz#2a114b51d2a6ec9e6d83cf803f838a878d8a023a" integrity sha512-TCZ36BjURTeFTM/CwRcViQlfkMvL1/vFISuNLO5GkcVm1+QHfbSiNqZuWeMFjj1/3+uAjXswgRk30j1kkLYJBQ== -"moment@>= 2.9.0", moment@^2.24.0: +"moment@>= 2.9.0": version "2.24.0" resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b" integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg== +moment@^2.20.1: + version "2.20.1" + resolved "https://registry.yarnpkg.com/moment/-/moment-2.20.1.tgz#d6eb1a46cbcc14a2b2f9434112c1ff8907f313fd" + integrity sha512-Yh9y73JRljxW5QxN08Fner68eFLxM5ynNOAw2LbIB1YAGeQzZT8QFSUvkAz609Zf+IHhhaUxqZK8dG3W/+HEvg== + monocle-ts@^1.0.0: version "1.7.2" resolved "https://registry.yarnpkg.com/monocle-ts/-/monocle-ts-1.7.2.tgz#d9825ae18846ab63f915cb6f2194a78a40025610"