From f41a0559fa7ed5ecbee26ac7e780aeca36a5d018 Mon Sep 17 00:00:00 2001 From: Jamin Date: Tue, 26 Dec 2023 15:06:33 +0000 Subject: [PATCH] Frontend: Migrate `NewsContainer.tsx` from aria-label e2e selectors to data-testid (#79666) --- .betterer.results | 6 ------ .../grafana-e2e-selectors/src/selectors/components.ts | 2 +- packages/grafana-ui/src/components/Drawer/Drawer.tsx | 11 ++++++----- .../core/components/AppChrome/News/NewsContainer.tsx | 10 +++++----- public/locales/de-DE/grafana.json | 6 ++++++ public/locales/en-US/grafana.json | 6 ++++++ public/locales/es-ES/grafana.json | 6 ++++++ public/locales/fr-FR/grafana.json | 6 ++++++ public/locales/pseudo-LOCALE/grafana.json | 6 ++++++ public/locales/zh-Hans/grafana.json | 6 ++++++ 10 files changed, 48 insertions(+), 17 deletions(-) diff --git a/.betterer.results b/.betterer.results index b042d926eca..1204befc266 100644 --- a/.betterer.results +++ b/.betterer.results @@ -625,9 +625,6 @@ exports[`better eslint`] = { "packages/grafana-ui/src/components/DateTimePickers/TimeRangeInput.tsx:5381": [ [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"] ], - "packages/grafana-ui/src/components/Drawer/Drawer.tsx:5381": [ - [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"] - ], "packages/grafana-ui/src/components/Forms/Legacy/Input/Input.tsx:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Do not use any type assertions.", "1"], @@ -954,9 +951,6 @@ exports[`better eslint`] = { [0, 0, 0, "Unexpected any. Specify a different type.", "5"], [0, 0, 0, "Unexpected any. Specify a different type.", "6"] ], - "public/app/core/components/AppChrome/News/NewsContainer.tsx:5381": [ - [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"] - ], "public/app/core/components/AppChrome/SectionNav/SectionNavItem.tsx:5381": [ [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"], [0, 0, 0, "Styles should be written using objects.", "1"], diff --git a/packages/grafana-e2e-selectors/src/selectors/components.ts b/packages/grafana-e2e-selectors/src/selectors/components.ts index d115697de25..927e79ef5c0 100644 --- a/packages/grafana-e2e-selectors/src/selectors/components.ts +++ b/packages/grafana-e2e-selectors/src/selectors/components.ts @@ -133,7 +133,7 @@ export const Components = { title: (title: string) => `Drawer title ${title}`, expand: 'Drawer expand', contract: 'Drawer contract', - close: 'Drawer close', + close: 'data-testid Drawer close', rcContentWrapper: () => '.rc-drawer-content-wrapper', }, }, diff --git a/packages/grafana-ui/src/components/Drawer/Drawer.tsx b/packages/grafana-ui/src/components/Drawer/Drawer.tsx index aebf585ccc7..d36c05ff733 100644 --- a/packages/grafana-ui/src/components/Drawer/Drawer.tsx +++ b/packages/grafana-ui/src/components/Drawer/Drawer.tsx @@ -9,8 +9,9 @@ import { GrafanaTheme2 } from '@grafana/data'; import { selectors } from '@grafana/e2e-selectors'; import { useStyles2 } from '../../themes'; -import { Button } from '../Button'; +import { t } from '../../utils/i18n'; import { CustomScrollbar } from '../CustomScrollbar/CustomScrollbar'; +import { IconButton } from '../IconButton/IconButton'; import { Text } from '../Text/Text'; export interface Props { @@ -116,12 +117,12 @@ export function Drawer({ {typeof title === 'string' && (
-
diff --git a/public/app/core/components/AppChrome/News/NewsContainer.tsx b/public/app/core/components/AppChrome/News/NewsContainer.tsx index 2c0815b6b4f..ff093427769 100644 --- a/public/app/core/components/AppChrome/News/NewsContainer.tsx +++ b/public/app/core/components/AppChrome/News/NewsContainer.tsx @@ -4,7 +4,7 @@ import { useToggle } from 'react-use'; import { GrafanaTheme2 } from '@grafana/data'; import { selectors } from '@grafana/e2e-selectors'; -import { Button, Drawer, ToolbarButton, useStyles2, Text } from '@grafana/ui'; +import { IconButton, Drawer, ToolbarButton, useStyles2, Text } from '@grafana/ui'; import { t } from 'app/core/internationalization'; import { DEFAULT_FEED_URL } from 'app/plugins/panel/news/constants'; @@ -36,12 +36,12 @@ export function NewsContainer({ className }: NewsContainerProps) { Grot reading news
-
diff --git a/public/locales/de-DE/grafana.json b/public/locales/de-DE/grafana.json index 24d3db1e7fb..e01da116355 100644 --- a/public/locales/de-DE/grafana.json +++ b/public/locales/de-DE/grafana.json @@ -412,6 +412,9 @@ "label": "Neue Datenquelle hinzufügen" } }, + "drawer": { + "close": "" + }, "explore": { "add-to-dashboard": "Zum Dashboard hinzufügen", "rich-history": { @@ -970,6 +973,9 @@ } }, "news": { + "drawer": { + "close": "" + }, "title": "Das Neueste aus dem Blog" }, "notifications": { diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json index a896c5eeec2..2f81ff99e7a 100644 --- a/public/locales/en-US/grafana.json +++ b/public/locales/en-US/grafana.json @@ -412,6 +412,9 @@ "label": "Add new data source" } }, + "drawer": { + "close": "Close Drawer" + }, "explore": { "add-to-dashboard": "Add to dashboard", "rich-history": { @@ -970,6 +973,9 @@ } }, "news": { + "drawer": { + "close": "Close Drawer" + }, "title": "Latest from the blog" }, "notifications": { diff --git a/public/locales/es-ES/grafana.json b/public/locales/es-ES/grafana.json index 7918f969323..f002bac07a5 100644 --- a/public/locales/es-ES/grafana.json +++ b/public/locales/es-ES/grafana.json @@ -417,6 +417,9 @@ "label": "Añadir nueva fuente de datos" } }, + "drawer": { + "close": "" + }, "explore": { "add-to-dashboard": "Añadir al tablero", "rich-history": { @@ -976,6 +979,9 @@ } }, "news": { + "drawer": { + "close": "" + }, "title": "Últimas entradas del blog" }, "notifications": { diff --git a/public/locales/fr-FR/grafana.json b/public/locales/fr-FR/grafana.json index be7d281b615..c667fe92e90 100644 --- a/public/locales/fr-FR/grafana.json +++ b/public/locales/fr-FR/grafana.json @@ -417,6 +417,9 @@ "label": "Ajouter une nouvelle source de données" } }, + "drawer": { + "close": "" + }, "explore": { "add-to-dashboard": "Ajouter au tableau de bord", "rich-history": { @@ -976,6 +979,9 @@ } }, "news": { + "drawer": { + "close": "" + }, "title": "Dernières nouvelles sur le blog" }, "notifications": { diff --git a/public/locales/pseudo-LOCALE/grafana.json b/public/locales/pseudo-LOCALE/grafana.json index 64de0a87f32..2dcbe4e2754 100644 --- a/public/locales/pseudo-LOCALE/grafana.json +++ b/public/locales/pseudo-LOCALE/grafana.json @@ -412,6 +412,9 @@ "label": "Åđđ ʼnęŵ đäŧä şőūřčę" } }, + "drawer": { + "close": "Cľőşę Đřäŵęř" + }, "explore": { "add-to-dashboard": "Åđđ ŧő đäşĥþőäřđ", "rich-history": { @@ -970,6 +973,9 @@ } }, "news": { + "drawer": { + "close": "Cľőşę Đřäŵęř" + }, "title": "Ŀäŧęşŧ ƒřőm ŧĥę þľőģ" }, "notifications": { diff --git a/public/locales/zh-Hans/grafana.json b/public/locales/zh-Hans/grafana.json index 2cb76ab32ae..23d9a20d313 100644 --- a/public/locales/zh-Hans/grafana.json +++ b/public/locales/zh-Hans/grafana.json @@ -407,6 +407,9 @@ "label": "添加新数据源" } }, + "drawer": { + "close": "" + }, "explore": { "add-to-dashboard": "添加到仪表板", "rich-history": { @@ -964,6 +967,9 @@ } }, "news": { + "drawer": { + "close": "" + }, "title": "最新博客" }, "notifications": {