From 6df218b010f9253a3addce6a00dd9b6dffffa4ae Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Mon, 9 Oct 2023 11:18:23 -0700 Subject: [PATCH 1/7] Upgrade EUI to v89.0.0 --- package.json | 2 +- src/dev/license_checker/config.ts | 2 +- yarn.lock | 8 ++++---- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index f2fc3641105f99..dea9b2710f64b1 100644 --- a/package.json +++ b/package.json @@ -102,7 +102,7 @@ "@elastic/datemath": "5.0.3", "@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@8.9.1-canary.1", "@elastic/ems-client": "8.4.0", - "@elastic/eui": "88.5.4", + "@elastic/eui": "89.0.0", "@elastic/filesaver": "1.1.2", "@elastic/node-crypto": "1.2.1", "@elastic/numeral": "^2.5.1", diff --git a/src/dev/license_checker/config.ts b/src/dev/license_checker/config.ts index e5ee6fbf76735c..037ea764083efd 100644 --- a/src/dev/license_checker/config.ts +++ b/src/dev/license_checker/config.ts @@ -85,7 +85,7 @@ export const LICENSE_OVERRIDES = { 'jsts@1.6.2': ['Eclipse Distribution License - v 1.0'], // cf. https://github.com/bjornharrtell/jsts '@mapbox/jsonlint-lines-primitives@2.0.2': ['MIT'], // license in readme https://github.com/tmcw/jsonlint '@elastic/ems-client@8.4.0': ['Elastic License 2.0'], - '@elastic/eui@88.5.4': ['SSPL-1.0 OR Elastic License 2.0'], + '@elastic/eui@89.0.0': ['SSPL-1.0 OR Elastic License 2.0'], 'language-subtag-registry@0.3.21': ['CC-BY-4.0'], // retired ODC‑By license https://github.com/mattcg/language-subtag-registry 'buffers@0.1.1': ['MIT'], // license in importing module https://www.npmjs.com/package/binary }; diff --git a/yarn.lock b/yarn.lock index 8aec5b33e6fc5c..1970525b853e08 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1603,10 +1603,10 @@ resolved "https://registry.yarnpkg.com/@elastic/eslint-plugin-eui/-/eslint-plugin-eui-0.0.2.tgz#56b9ef03984a05cc213772ae3713ea8ef47b0314" integrity sha512-IoxURM5zraoQ7C8f+mJb9HYSENiZGgRVcG4tLQxE61yHNNRDXtGDWTZh8N1KIHcsqN1CEPETjuzBXkJYF/fDiQ== -"@elastic/eui@88.5.4": - version "88.5.4" - resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-88.5.4.tgz#7bfb1b0f9b49d745d98cfd3a912784b7f25626bd" - integrity sha512-1aq//kTcwuyXeH48kgG91i+4qlzreZUaLfpfQ0Lxcfq09fmJYqNjJLFnCE8f5zj1vIiEEdINywkr4Bk64VIoVQ== +"@elastic/eui@89.0.0": + version "89.0.0" + resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-89.0.0.tgz#673c1aeecd875ea2ad51dffade4ffea2d3cea4c0" + integrity sha512-wE3GaGjPVGHNeuCsJ3lXwDlbTeXPQvz69I00EWkHyoJoKDXk/2i7sRGIXYlTNWZ9ppwloBCPyPAKW71jiN8JBQ== dependencies: "@hello-pangea/dnd" "^16.3.0" "@types/lodash" "^4.14.198" From 81b4aae586fc87a7112194e5626afff5c1a418cd Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Mon, 9 Oct 2023 11:25:33 -0700 Subject: [PATCH 2/7] i18n updates - mostly removing strings from deprecated components --- .../__snapshots__/i18n_service.test.tsx.snap | 13 ---- .../src/i18n_eui_mapping.tsx | 60 ------------------- .../translations/translations/fr-FR.json | 13 ---- .../translations/translations/ja-JP.json | 15 +---- .../translations/translations/zh-CN.json | 15 +---- 5 files changed, 2 insertions(+), 114 deletions(-) diff --git a/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap b/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap index 49797f086e9984..83a864adc2b1cb 100644 --- a/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap +++ b/packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap @@ -45,13 +45,6 @@ exports[`#start() returns \`Context\` component 1`] = ` "euiColorPicker.popoverLabel": "Color selection dialog", "euiColorPicker.transparent": "Transparent", "euiColorPickerSwatch.ariaLabel": [Function], - "euiColorStopThumb.buttonAriaLabel": "Press the Enter key to modify this stop. Press Escape to focus the group", - "euiColorStopThumb.buttonTitle": "Click to edit, drag to reposition", - "euiColorStopThumb.removeLabel": "Remove this stop", - "euiColorStopThumb.screenReaderAnnouncement": "A popup with a color stop edit form opened. Tab forward to cycle through form controls or press escape to close this popup.", - "euiColorStopThumb.stopErrorMessage": "Value is out of range", - "euiColorStopThumb.stopLabel": "Stop value", - "euiColorStops.screenReaderAnnouncement": [Function], "euiColumnActions.hideColumn": "Hide column", "euiColumnActions.moveLeft": "Move left", "euiColumnActions.moveRight": "Move right", @@ -340,12 +333,6 @@ exports[`#start() returns \`Context\` component 1`] = ` "euiStepStrings.simpleWarning": [Function], "euiStepStrings.step": [Function], "euiStepStrings.warning": [Function], - "euiSuggest.stateLoading": "State: loading.", - "euiSuggest.stateSaved": "State: saved.", - "euiSuggest.stateSavedTooltip": "Saved.", - "euiSuggest.stateUnchanged": "State: unchanged.", - "euiSuggest.stateUnsaved": "State: unsaved.", - "euiSuggest.stateUnsavedTooltip": "Changes have not been saved.", "euiSuperSelect.ariaLabel": "Select listbox", "euiSuperSelect.screenReaderAnnouncement": "You are in a form selector and must select a single option. Use the Up and Down arrow keys to navigate or Escape to close.", "euiSuperUpdateButton.cannotUpdateTooltip": "Cannot update", diff --git a/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx b/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx index e90889ceef612a..2f62c04b40e742 100644 --- a/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx +++ b/packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx @@ -202,44 +202,6 @@ export const getEuiContextMapping = (): EuiTokensObject => { 'euiColorPicker.popoverLabel': i18n.translate('core.euiColorPicker.popoverLabel', { defaultMessage: 'Color selection dialog', }), - 'euiColorStopThumb.removeLabel': i18n.translate('core.euiColorStopThumb.removeLabel', { - defaultMessage: 'Remove this stop', - description: 'Label accompanying a button whose action will remove the color stop', - }), - 'euiColorStopThumb.screenReaderAnnouncement': i18n.translate( - 'core.euiColorStopThumb.screenReaderAnnouncement', - { - defaultMessage: - 'A popup with a color stop edit form opened. Tab forward to cycle through form controls or press escape to close this popup.', - description: - 'Message when the color picker popover has opened for an individual color stop thumb.', - } - ), - 'euiColorStopThumb.buttonAriaLabel': i18n.translate('core.euiColorStopThumb.buttonAriaLabel', { - defaultMessage: 'Press the Enter key to modify this stop. Press Escape to focus the group', - description: 'Screen reader text to describe picker interaction', - }), - 'euiColorStopThumb.buttonTitle': i18n.translate('core.euiColorStopThumb.buttonTitle', { - defaultMessage: 'Click to edit, drag to reposition', - description: 'Screen reader text to describe button interaction', - }), - 'euiColorStopThumb.stopLabel': i18n.translate('core.euiColorStopThumb.stopLabel', { - defaultMessage: 'Stop value', - }), - 'euiColorStopThumb.stopErrorMessage': i18n.translate( - 'core.euiColorStopThumb.stopErrorMessage', - { - defaultMessage: 'Value is out of range', - } - ), - 'euiColorStops.screenReaderAnnouncement': ({ label, readOnly, disabled }: EuiValues) => - i18n.translate('core.euiColorStops.screenReaderAnnouncement', { - defaultMessage: - '{label}: {readOnly} {disabled} Color stop picker. Each stop consists of a number and corresponding color value. Use the Down and Up arrow keys to select individual stops. Press the Enter key to create a new stop.', - values: { label, readOnly, disabled }, - description: - 'Screen reader text to describe the composite behavior of the color stops component.', - }), 'euiColorPickerSwatch.ariaLabel': ({ color }: EuiValues) => i18n.translate('core.euiColorPickerSwatch.ariaLabel', { defaultMessage: 'Select {color} as the color', @@ -1711,28 +1673,6 @@ export const getEuiContextMapping = (): EuiTokensObject => { defaultMessage: 'Step {number} is loading', values: { number }, }), - 'euiSuggest.stateSavedTooltip': i18n.translate('core.euiSuggest.stateSavedTooltip', { - defaultMessage: 'Saved.', - }), - - 'euiSuggest.stateUnsavedTooltip': i18n.translate('core.euiSuggest.stateUnsavedTooltip', { - defaultMessage: 'Changes have not been saved.', - }), - - 'euiSuggest.stateLoading': i18n.translate('core.euiSuggest.stateLoading', { - defaultMessage: 'State: loading.', - }), - - 'euiSuggest.stateSaved': i18n.translate('core.euiSuggest.stateSaved', { - defaultMessage: 'State: saved.', - }), - - 'euiSuggest.stateUnsaved': i18n.translate('core.euiSuggest.stateUnsaved', { - defaultMessage: 'State: unsaved.', - }), - 'euiSuggest.stateUnchanged': i18n.translate('core.euiSuggest.stateUnchanged', { - defaultMessage: 'State: unchanged.', - }), 'euiSuperSelect.screenReaderAnnouncement': i18n.translate( 'core.euiSuperSelect.screenReaderAnnouncement', { diff --git a/x-pack/plugins/translations/translations/fr-FR.json b/x-pack/plugins/translations/translations/fr-FR.json index f9ed961ecc9de3..f86c6bcc9b74ee 100644 --- a/x-pack/plugins/translations/translations/fr-FR.json +++ b/x-pack/plugins/translations/translations/fr-FR.json @@ -536,7 +536,6 @@ "core.euiBottomBar.customScreenReaderAnnouncement": "Il y a un nouveau repère de région appelé {landmarkHeading} avec des commandes de niveau de page à la fin du document.", "core.euiCodeBlockAnnotations.ariaLabel": "Cliquez pour afficher une annotation de code pour la ligne {lineNumber}", "core.euiColorPickerSwatch.ariaLabel": "Sélectionner {color} comme couleur", - "core.euiColorStops.screenReaderAnnouncement": "{label} : {readOnly} {disabled} Sélecteur d'arrêt de couleur. Chaque arrêt consiste en un nombre et en une valeur de couleur correspondante. Utilisez les flèches haut et bas pour sélectionner les arrêts. Appuyez sur Entrée pour créer un nouvel arrêt.", "core.euiColumnActions.sort": "Trier {schemaLabel}", "core.euiColumnSelector.buttonActivePlural": "{numberOfHiddenFields} colonnes masquées", "core.euiColumnSelector.buttonActiveSingular": "{numberOfHiddenFields} colonne masquée", @@ -676,12 +675,6 @@ "core.euiColorPicker.openLabel": "Appuyez sur Échap pour fermer la fenêtre contextuelle.", "core.euiColorPicker.popoverLabel": "Boîte de dialogue de sélection de couleur", "core.euiColorPicker.transparent": "Transparent", - "core.euiColorStopThumb.buttonAriaLabel": "Appuyez sur Entrée pour modifier cet arrêt. Appuyez sur Échap pour revenir au groupe.", - "core.euiColorStopThumb.buttonTitle": "Cliquez pour modifier, faites glisser pour repositionner.", - "core.euiColorStopThumb.removeLabel": "Supprimer cet arrêt", - "core.euiColorStopThumb.screenReaderAnnouncement": "La fenêtre contextuelle qui vient de s’ouvrir contient un formulaire de modification d'arrêt de couleur. Appuyez sur Tab pour parcourir les commandes du formulaire ou sur Échap pour fermer la fenêtre.", - "core.euiColorStopThumb.stopErrorMessage": "Valeur hors limites", - "core.euiColorStopThumb.stopLabel": "Valeur d'arrêt", "core.euiColumnActions.hideColumn": "Masquer la colonne", "core.euiColumnActions.moveLeft": "Déplacer vers la gauche", "core.euiColumnActions.moveRight": "Déplacer vers la droite", @@ -871,12 +864,6 @@ "core.euiSelectableTemplateSitewide.onFocusBadgeGoTo": "Atteindre", "core.euiSelectableTemplateSitewide.searchPlaceholder": "Rechercher tout...", "core.euiStat.loadingText": "Statistiques en cours de chargement", - "core.euiSuggest.stateLoading": "État : chargement.", - "core.euiSuggest.stateSaved": "État : enregistré.", - "core.euiSuggest.stateSavedTooltip": "Enregistré.", - "core.euiSuggest.stateUnchanged": "État : non modifié.", - "core.euiSuggest.stateUnsaved": "État : non enregistré.", - "core.euiSuggest.stateUnsavedTooltip": "Les modifications n'ont pas été enregistrées.", "core.euiSuperSelect.ariaLabel": "Sélectionner la zone de liste", "core.euiSuperSelect.screenReaderAnnouncement": "Vous êtes dans un sélecteur de formulaires et vous devez sélectionner une seule option. Utilisez les flèches vers le haut et vers le bas pour naviguer, ou appuyez sur Échap pour fermer.", "core.euiSuperUpdateButton.cannotUpdateTooltip": "Mise à jour impossible", diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index 5efc40199e1646..4f59b7c0647fee 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -229,7 +229,7 @@ "coloring.dynamicColoring.rangeType.label": "値型", "coloring.dynamicColoring.rangeType.number": "数字", "coloring.dynamicColoring.rangeType.percent": "割合(%)", - "coloring.colorMapping.terms.otherBucketLabel":"その他", + "coloring.colorMapping.terms.otherBucketLabel": "その他", "coloring.colorMapping.terms.emptyLabel": "(空)", "console.helpPage.learnAboutConsoleAndQueryDslText": "{console}と{queryDsl}についてさらに詳しく", "console.historyPage.itemOfRequestListAriaLabel": "リクエスト:{historyItem}", @@ -536,7 +536,6 @@ "core.euiBottomBar.customScreenReaderAnnouncement": "ドキュメントの最後には、{landmarkHeading}という新しいリージョンランドマークとページレベルのコントロールがあります。", "core.euiCodeBlockAnnotations.ariaLabel": "クリックすると、行番号{lineNumber}のコード注釈が表示されます", "core.euiColorPickerSwatch.ariaLabel": "{color}を色として選択します", - "core.euiColorStops.screenReaderAnnouncement": "{label}:{readOnly}{disabled}カラーストップピッカー。各終了には数値と対応するカラー値があります。上下矢印キーを使用して、個別の終了を選択します。Enterキーを押すと、新しい終了を作成します。", "core.euiColumnActions.sort": "{schemaLabel}の並べ替え", "core.euiColumnSelector.buttonActivePlural": "{numberOfHiddenFields}列が非表示です", "core.euiColumnSelector.buttonActiveSingular": "{numberOfHiddenFields}列が非表示です", @@ -690,12 +689,6 @@ "core.euiColorPicker.openLabel": "Escapeキーを押すと、ポップオーバーを閉じます", "core.euiColorPicker.popoverLabel": "色選択ダイアログ", "core.euiColorPicker.transparent": "透明", - "core.euiColorStopThumb.buttonAriaLabel": "Enterキーを押すと、この点を変更します。Escapeキーを押すと、グループにフォーカスします", - "core.euiColorStopThumb.buttonTitle": "クリックすると編集できます。ドラッグすると再配置できます", - "core.euiColorStopThumb.removeLabel": "この終了を削除", - "core.euiColorStopThumb.screenReaderAnnouncement": "カラー終了編集フォームのポップアップが開きました。Tabを押してフォームコントロールを閲覧するか、Escでこのポップアップを閉じます。", - "core.euiColorStopThumb.stopErrorMessage": "値が範囲外です", - "core.euiColorStopThumb.stopLabel": "点値", "core.euiColumnActions.hideColumn": "列を非表示", "core.euiColumnActions.moveLeft": "左に移動", "core.euiColumnActions.moveRight": "右に移動", @@ -885,12 +878,6 @@ "core.euiSelectableTemplateSitewide.onFocusBadgeGoTo": "移動:", "core.euiSelectableTemplateSitewide.searchPlaceholder": "検索しています...", "core.euiStat.loadingText": "統計を読み込み中です", - "core.euiSuggest.stateLoading": "状態:読み込み中。", - "core.euiSuggest.stateSaved": "状態:保存済み。", - "core.euiSuggest.stateSavedTooltip": "保存されました。", - "core.euiSuggest.stateUnchanged": "状態:未変更。", - "core.euiSuggest.stateUnsaved": "状態:未保存。", - "core.euiSuggest.stateUnsavedTooltip": "変更は保存されていません。", "core.euiSuperSelect.ariaLabel": "リストボックスを選択", "core.euiSuperSelect.screenReaderAnnouncement": "フォームセレクターを使用中で、1 つのオプションを選択する必要があります。移動するには上下矢印キーを使用し、閉じるにはEscキーを押します。", "core.euiSuperUpdateButton.cannotUpdateTooltip": "アップデートできません", diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json index 37c95c19b5b3e4..3c360525d42f31 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -229,7 +229,7 @@ "coloring.dynamicColoring.rangeType.label": "值类型", "coloring.dynamicColoring.rangeType.number": "数字", "coloring.dynamicColoring.rangeType.percent": "百分比", - "coloring.colorMapping.terms.otherBucketLabel":"其他", + "coloring.colorMapping.terms.otherBucketLabel": "其他", "coloring.colorMapping.terms.emptyLabel": "(空)", "console.helpPage.learnAboutConsoleAndQueryDslText": "了解 {console} 和 {queryDsl}", "console.historyPage.itemOfRequestListAriaLabel": "请求:{historyItem}", @@ -536,7 +536,6 @@ "core.euiBottomBar.customScreenReaderAnnouncement": "有称作 {landmarkHeading} 且页面级别控件位于文档结尾的新地区地标。", "core.euiCodeBlockAnnotations.ariaLabel": "单击以查看行 {lineNumber} 的代码注释", "core.euiColorPickerSwatch.ariaLabel": "将 {color} 选为颜色", - "core.euiColorStops.screenReaderAnnouncement": "{label}:{readOnly} {disabled} 颜色停止点选取器。每个停止点由数字和相应颜色值构成。使用向下和向上箭头键选择单个停止点。按 Enter 键创建新的停止点。", "core.euiColumnActions.sort": "排序 {schemaLabel}", "core.euiColumnSelector.buttonActivePlural": "{numberOfHiddenFields} 列已隐藏", "core.euiColumnSelector.buttonActiveSingular": "{numberOfHiddenFields} 列已隐藏", @@ -690,12 +689,6 @@ "core.euiColorPicker.openLabel": "按 Esc 键关闭弹出框", "core.euiColorPicker.popoverLabel": "颜色选择对话框", "core.euiColorPicker.transparent": "透明", - "core.euiColorStopThumb.buttonAriaLabel": "按 Enter 键修改此停止点。按 Esc 键聚焦该组", - "core.euiColorStopThumb.buttonTitle": "单击编辑,拖动重新定位", - "core.euiColorStopThumb.removeLabel": "删除此停止点", - "core.euiColorStopThumb.screenReaderAnnouncement": "打开颜色停止点编辑表单的弹出式窗口。按 Tab 键正向依次选择表单控件或按 Esc 键关闭此弹出式窗口。", - "core.euiColorStopThumb.stopErrorMessage": "值超出范围", - "core.euiColorStopThumb.stopLabel": "停止点值", "core.euiColumnActions.hideColumn": "隐藏列", "core.euiColumnActions.moveLeft": "左移", "core.euiColumnActions.moveRight": "右移", @@ -885,12 +878,6 @@ "core.euiSelectableTemplateSitewide.onFocusBadgeGoTo": "前往", "core.euiSelectableTemplateSitewide.searchPlaceholder": "搜索任何内容......", "core.euiStat.loadingText": "统计正在加载", - "core.euiSuggest.stateLoading": "状态:正在加载。", - "core.euiSuggest.stateSaved": "状态:已保存。", - "core.euiSuggest.stateSavedTooltip": "已保存。", - "core.euiSuggest.stateUnchanged": "状态:未更改。", - "core.euiSuggest.stateUnsaved": "状态:未保存。", - "core.euiSuggest.stateUnsavedTooltip": "更改尚未保存。", "core.euiSuperSelect.ariaLabel": "选择列表框", "core.euiSuperSelect.screenReaderAnnouncement": "您位于表单选择器中,必须选择单个选项。使用向上和向下箭头键导航,使用 Esc 键关闭。", "core.euiSuperUpdateButton.cannotUpdateTooltip": "无法更新", From d095473148297ca126d2a0a6275b0dc8d888336e Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Mon, 9 Oct 2023 11:18:40 -0700 Subject: [PATCH 3/7] Account for deprecated `$euiHeaderHeightCompensation` --- examples/search_examples/public/index.scss | 2 -- x-pack/plugins/painless_lab/public/styles/_index.scss | 4 ++-- x-pack/plugins/searchprofiler/public/application/_app.scss | 2 +- x-pack/plugins/searchprofiler/public/application/_index.scss | 2 -- 4 files changed, 3 insertions(+), 7 deletions(-) diff --git a/examples/search_examples/public/index.scss b/examples/search_examples/public/index.scss index b623fecf78640f..331b0175914926 100644 --- a/examples/search_examples/public/index.scss +++ b/examples/search_examples/public/index.scss @@ -1,5 +1,3 @@ -@import '@elastic/eui/src/global_styling/variables/header'; - .searchExampleStepDsc { padding-left: $euiSizeXL; font-style: italic; diff --git a/x-pack/plugins/painless_lab/public/styles/_index.scss b/x-pack/plugins/painless_lab/public/styles/_index.scss index 4844fe443e56f2..801f655fa7f4ce 100644 --- a/x-pack/plugins/painless_lab/public/styles/_index.scss +++ b/x-pack/plugins/painless_lab/public/styles/_index.scss @@ -1,4 +1,3 @@ -@import '@elastic/eui/src/global_styling/variables/header'; @import '../../../../../src/core/public/mixins'; /** @@ -35,7 +34,8 @@ $bottomBarHeight: $euiSize * 3; } // adding dev tool top bar + bottom bar height to the body offset -$bodyOffset: $euiHeaderHeightCompensation + $bottomBarHeight; +// (they're both the same height, hence the x2) +$bodyOffset: $bottomBarHeight * 2; .painlessLabMainContainer { @include kibanaFullBodyHeight($bodyOffset); diff --git a/x-pack/plugins/searchprofiler/public/application/_app.scss b/x-pack/plugins/searchprofiler/public/application/_app.scss index 1b7b44e28bc628..36af03021ac4c3 100644 --- a/x-pack/plugins/searchprofiler/public/application/_app.scss +++ b/x-pack/plugins/searchprofiler/public/application/_app.scss @@ -27,7 +27,7 @@ } // adding dev tool top bar to the body offset -$bodyOffset: $euiHeaderHeightCompensation; +$bodyOffset: $euiSize * 3; .appRoot { @include kibanaFullBodyHeight($bodyOffset); diff --git a/x-pack/plugins/searchprofiler/public/application/_index.scss b/x-pack/plugins/searchprofiler/public/application/_index.scss index 65ab5cc0e13f3a..ea9b01c2639636 100644 --- a/x-pack/plugins/searchprofiler/public/application/_index.scss +++ b/x-pack/plugins/searchprofiler/public/application/_index.scss @@ -1,4 +1,2 @@ -@import '@elastic/eui/src/global_styling/variables/header'; - @import 'app'; @import 'components/index'; From 3e6401a3f478fd04c0ee67e631d7d5e62f389e19 Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Mon, 9 Oct 2023 11:21:39 -0700 Subject: [PATCH 4/7] [EuiComboBox] Update snapshots --- .../__snapshots__/index.test.tsx.snap | 688 ++++++++++-------- 1 file changed, 376 insertions(+), 312 deletions(-) diff --git a/packages/kbn-securitysolution-autocomplete/src/field/__tests__/__snapshots__/index.test.tsx.snap b/packages/kbn-securitysolution-autocomplete/src/field/__tests__/__snapshots__/index.test.tsx.snap index 9fefe47c379bb8..8cc75ec2beab86 100644 --- a/packages/kbn-securitysolution-autocomplete/src/field/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/kbn-securitysolution-autocomplete/src/field/__tests__/__snapshots__/index.test.tsx.snap @@ -10,66 +10,74 @@ Object { data-test-subj="fieldAutocompleteComboBox" >
- - - machine.os.raw - - - -
-
- - + + + machine.os.raw + + + +
+
+ + +
+
@@ -82,66 +90,74 @@ Object { data-test-subj="fieldAutocompleteComboBox" >
- - - machine.os.raw - - - -
-
- - + + + machine.os.raw + + + +
+
+ + +
+
@@ -211,39 +227,47 @@ Object { data-test-subj="fieldAutocompleteComboBox" >
- - - machine.os.raw - - - + + + machine.os.raw + + + +
+
@@ -256,39 +280,47 @@ Object { data-test-subj="fieldAutocompleteComboBox" >
- - - machine.os.raw - - - + + + machine.os.raw + + + +
+
@@ -358,55 +390,63 @@ Object { data-test-subj="fieldAutocompleteComboBox" >
- - - machine.os.raw - - - -
-
- + + + machine.os.raw + + + +
+
+ +
+
@@ -419,55 +459,63 @@ Object { data-test-subj="fieldAutocompleteComboBox" >
- - - machine.os.raw - - - -
-
- + + + machine.os.raw + + + +
+
+ +
+
@@ -537,48 +585,56 @@ Object { data-test-subj="fieldAutocompleteComboBox" >
- - - machine.os.raw - - - -
-
- + + + machine.os.raw + + + +
+
+ +
+
@@ -591,48 +647,56 @@ Object { data-test-subj="fieldAutocompleteComboBox" >
- - - machine.os.raw - - - -
-
- + + + machine.os.raw + + + +
+
+ +
+
From d7b1cb11a896b4b5f3ec09953540eaadaab08de0 Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Mon, 9 Oct 2023 12:40:02 -0700 Subject: [PATCH 5/7] [EuiComboBox] Update various RTL to use awaited helpers - tests fail otherwise, as the popover has `pointer-events: none` while transitioning in --- .../category/category_component.test.tsx | 6 +++--- .../control_general_view_response/index.test.tsx | 13 ++++++++----- .../control_general_view_selector/index.test.tsx | 9 +++++---- .../__tests__/add_data_provider_popover.test.tsx | 16 +++++----------- 4 files changed, 21 insertions(+), 23 deletions(-) diff --git a/x-pack/plugins/cases/public/components/category/category_component.test.tsx b/x-pack/plugins/cases/public/components/category/category_component.test.tsx index 281051f59f5991..2b0d7ef39007b9 100644 --- a/x-pack/plugins/cases/public/components/category/category_component.test.tsx +++ b/x-pack/plugins/cases/public/components/category/category_component.test.tsx @@ -11,6 +11,7 @@ import type { CategoryComponentProps } from './category_component'; import { CategoryComponent } from './category_component'; import { waitFor, render, screen } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; +import { showEuiComboBoxOptions } from '@elastic/eui/lib/test/rtl'; const onChange = jest.fn(); const defaultProps: CategoryComponentProps = { @@ -60,8 +61,7 @@ describe('Category ', () => { it('renders current option list', async () => { render(); - - userEvent.click(screen.getByTestId('comboBoxToggleListButton')); + await showEuiComboBoxOptions(); expect(screen.getByText('foo')).toBeInTheDocument(); expect(screen.getByText('bar')).toBeInTheDocument(); @@ -69,8 +69,8 @@ describe('Category ', () => { it('should call onChange when changing an option', async () => { render(); + await showEuiComboBoxOptions(); - userEvent.click(screen.getByTestId('comboBoxToggleListButton')); userEvent.click(screen.getByText('foo')); expect(onChange).toHaveBeenCalledWith('foo'); diff --git a/x-pack/plugins/cloud_defend/public/components/control_general_view_response/index.test.tsx b/x-pack/plugins/cloud_defend/public/components/control_general_view_response/index.test.tsx index 5fbdd9f55135ce..681ca86c91201b 100644 --- a/x-pack/plugins/cloud_defend/public/components/control_general_view_response/index.test.tsx +++ b/x-pack/plugins/cloud_defend/public/components/control_general_view_response/index.test.tsx @@ -8,6 +8,7 @@ import React from 'react'; import { render, waitFor } from '@testing-library/react'; import { coreMock } from '@kbn/core/public/mocks'; import userEvent from '@testing-library/user-event'; +import { showEuiComboBoxOptions } from '@elastic/eui/lib/test/rtl'; import { TestProvider } from '../../test/test_provider'; import { ControlGeneralViewResponse } from '.'; import { Response, Selector } from '../../../common'; @@ -112,9 +113,9 @@ describe('', () => { expect(getByTestId('cloud-defend-chkblockaction')).not.toBeChecked(); }); - it('allows the user to add more selectors to match on', () => { + it('allows the user to add more selectors to match on', async () => { const { getByTestId, rerender } = render(); - getByTestId('comboBoxSearchInput').focus(); + await showEuiComboBoxOptions(); const options = getByTestId( 'comboBoxOptionsList cloud-defend-responsematch-optionsList' @@ -182,9 +183,11 @@ describe('', () => { // focus 'match' input box, lets ensure selectors can't be re-used across 'match' and 'exclude' fields getAllByTestId('comboBoxSearchInput')[0].focus(); - options = getByTestId( - 'comboBoxOptionsList cloud-defend-responsematch-optionsList' - ).querySelectorAll('.euiComboBoxOption__content'); + options = await waitFor(() => + getByTestId('comboBoxOptionsList cloud-defend-responsematch-optionsList').querySelectorAll( + '.euiComboBoxOption__content' + ) + ); expect(options).toHaveLength(2); expect(options[0].textContent).toBe('mock2'); }); diff --git a/x-pack/plugins/cloud_defend/public/components/control_general_view_selector/index.test.tsx b/x-pack/plugins/cloud_defend/public/components/control_general_view_selector/index.test.tsx index ae7dc61a2f67ca..b0561f2b596ad7 100644 --- a/x-pack/plugins/cloud_defend/public/components/control_general_view_selector/index.test.tsx +++ b/x-pack/plugins/cloud_defend/public/components/control_general_view_selector/index.test.tsx @@ -6,6 +6,7 @@ */ import React from 'react'; import { act, render, waitFor, fireEvent } from '@testing-library/react'; +import { showEuiComboBoxOptions } from '@elastic/eui/lib/test/rtl'; import { coreMock } from '@kbn/core/public/mocks'; import userEvent from '@testing-library/user-event'; import { TestProvider } from '../../test/test_provider'; @@ -100,11 +101,11 @@ describe('', () => { expect(getByText(i18n.unusedSelector)).toBeTruthy(); }); - it('allows the user to add a limited set of file operations', () => { + it('allows the user to add a limited set of file operations', async () => { const { getByTestId, rerender } = render(); getByTestId('cloud-defend-selectorcondition-operation').click(); - getByTestId('comboBoxSearchInput').focus(); + await showEuiComboBoxOptions(); const options = getByTestId( 'comboBoxOptionsList cloud-defend-selectorcondition-operation-optionsList' @@ -132,11 +133,11 @@ describe('', () => { expect(updatedOptions).toHaveLength(3); }); - it('allows the user to add a limited set of process operations', () => { + it('allows the user to add a limited set of process operations', async () => { const { getByTestId, rerender } = render(); getByTestId('cloud-defend-selectorcondition-operation').click(); - getByTestId('comboBoxSearchInput').focus(); + await showEuiComboBoxOptions(); const options = getByTestId( 'comboBoxOptionsList cloud-defend-selectorcondition-operation-optionsList' diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/data_providers/__tests__/add_data_provider_popover.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/data_providers/__tests__/add_data_provider_popover.test.tsx index b08ac9109f3f41..3fbbceecc25e4e 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/data_providers/__tests__/add_data_provider_popover.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/data_providers/__tests__/add_data_provider_popover.test.tsx @@ -6,8 +6,9 @@ */ import React from 'react'; +import { waitForEuiPopoverOpen, waitForEuiPopoverClose } from '@elastic/eui/lib/test/rtl'; import { AddDataProviderPopover } from '../add_data_provider_popover'; -import { render, screen, fireEvent, waitFor } from '@testing-library/react'; +import { render, screen, fireEvent } from '@testing-library/react'; import { TestProvidersComponent } from '../../../../../common/mock/test_providers'; import { mockBrowserFields } from '../../../../../common/containers/source/mock'; @@ -29,9 +30,7 @@ describe('Testing AddDataProviderPopover', () => { ); clickOnAddField(); - await waitFor(() => { - expect(screen.getByRole('dialog')).toBeVisible(); - }); + await waitForEuiPopoverOpen(); }); it('Test Popover goes away after clicking again on add field', async () => { @@ -42,14 +41,9 @@ describe('Testing AddDataProviderPopover', () => { ); clickOnAddField(); - await waitFor(() => { - expect(screen.getByRole('dialog')).toBeVisible(); - }); + await waitForEuiPopoverOpen(); clickOnAddField(); - - await waitFor(() => { - expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); - }); + await waitForEuiPopoverClose(); }); }); From 4f3bd611b504fdecc502f29d96282f6f441b2507 Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Mon, 9 Oct 2023 12:40:16 -0700 Subject: [PATCH 6/7] [EuiFlexGroup/Grid] Update snapshots --- .../explorer_charts/explorer_charts_container.test.js | 2 +- .../security/server/__snapshots__/prompt_page.test.tsx.snap | 4 ++-- .../__snapshots__/unauthenticated_page.test.tsx.snap | 4 ++-- .../__snapshots__/reset_session_page.test.tsx.snap | 4 ++-- 4 files changed, 7 insertions(+), 7 deletions(-) diff --git a/x-pack/plugins/ml/public/application/explorer/explorer_charts/explorer_charts_container.test.js b/x-pack/plugins/ml/public/application/explorer/explorer_charts/explorer_charts_container.test.js index 129ac8b42f02b1..766ab0ee7f7234 100644 --- a/x-pack/plugins/ml/public/application/explorer/explorer_charts/explorer_charts_container.test.js +++ b/x-pack/plugins/ml/public/application/explorer/explorer_charts/explorer_charts_container.test.js @@ -100,7 +100,7 @@ describe('ExplorerChartsContainer', () => { ); expect(wrapper.html()).toEqual( - '
' + '
' ); }); diff --git a/x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap b/x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap index ccedfc1b02171c..8eaa66ee35be93 100644 --- a/x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap +++ b/x-pack/plugins/security/server/__snapshots__/prompt_page.test.tsx.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`PromptPage renders as expected with additional scripts 1`] = `"ElasticMockedFonts

Some Title

Some Body
Action#1
Action#2
"`; +exports[`PromptPage renders as expected with additional scripts 1`] = `"ElasticMockedFonts

Some Title

Some Body
Action#1
Action#2
"`; -exports[`PromptPage renders as expected without additional scripts 1`] = `"ElasticMockedFonts

Some Title

Some Body
Action#1
Action#2
"`; +exports[`PromptPage renders as expected without additional scripts 1`] = `"ElasticMockedFonts

Some Title

Some Body
Action#1
Action#2
"`; diff --git a/x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap b/x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap index b16535269e1c9a..d7be0e5f720a58 100644 --- a/x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap +++ b/x-pack/plugins/security/server/authentication/__snapshots__/unauthenticated_page.test.tsx.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`UnauthenticatedPage renders as expected 1`] = `"ElasticMockedFonts

We hit an authentication error

Try logging in again, and if the problem persists, contact your system administrator.

"`; +exports[`UnauthenticatedPage renders as expected 1`] = `"ElasticMockedFonts

We hit an authentication error

Try logging in again, and if the problem persists, contact your system administrator.

"`; -exports[`UnauthenticatedPage renders as expected with custom title 1`] = `"My Company NameMockedFonts

We hit an authentication error

Try logging in again, and if the problem persists, contact your system administrator.

"`; +exports[`UnauthenticatedPage renders as expected with custom title 1`] = `"My Company NameMockedFonts

We hit an authentication error

Try logging in again, and if the problem persists, contact your system administrator.

"`; diff --git a/x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap b/x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap index 255cc8b4963a06..f66f33000de553 100644 --- a/x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap +++ b/x-pack/plugins/security/server/authorization/__snapshots__/reset_session_page.test.tsx.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`ResetSessionPage renders as expected 1`] = `"ElasticMockedFonts

You do not have permission to access the requested page

Either go back to the previous page or log in as a different user.

"`; +exports[`ResetSessionPage renders as expected 1`] = `"ElasticMockedFonts

You do not have permission to access the requested page

Either go back to the previous page or log in as a different user.

"`; -exports[`ResetSessionPage renders as expected with custom page title 1`] = `"My Company NameMockedFonts

You do not have permission to access the requested page

Either go back to the previous page or log in as a different user.

"`; +exports[`ResetSessionPage renders as expected with custom page title 1`] = `"My Company NameMockedFonts

You do not have permission to access the requested page

Either go back to the previous page or log in as a different user.

"`; From 7b784697e0e2ed18c2275d6bc0e8a01478bbc40f Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Mon, 9 Oct 2023 12:52:43 -0700 Subject: [PATCH 7/7] Update screenshot diff test - Diff is likely due to fixed `EuiFlexGroup` gap sizing - will leave it to the team to update the screenshots --- .../tests/login_selector/reset_session_page.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/test/security_functional/tests/login_selector/reset_session_page.ts b/x-pack/test/security_functional/tests/login_selector/reset_session_page.ts index e4a9321b4b6f76..4d7eb666a4bc37 100644 --- a/x-pack/test/security_functional/tests/login_selector/reset_session_page.ts +++ b/x-pack/test/security_functional/tests/login_selector/reset_session_page.ts @@ -49,7 +49,7 @@ export default function ({ getService, getPageObjects, updateBaselines }: FtrPro 'reset_session_page', updateBaselines ); - expect(percentDifference).to.be.lessThan(0.022); + expect(percentDifference).to.be.lessThan(0.029); }); }); }