Drawer: undeprecate `scrollableContent` (#100998)

* update Drawer

* fix unit tests

* update comment
pull/99516/head
Ashley Harrison 3 months ago committed by GitHub
parent 40d1677265
commit 60217d8dfd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 6
      packages/grafana-ui/src/components/Drawer/Drawer.tsx
  2. 8
      public/app/features/explore/spec/helper/assert.ts
  3. 4
      public/app/features/explore/spec/helper/interactions.ts
  4. 5
      public/app/features/explore/spec/helper/setup.tsx

@ -45,9 +45,10 @@ export interface Props {
size?: 'sm' | 'md' | 'lg';
/** Tabs */
tabs?: React.ReactNode;
// TODO remove this prop next major version
/**
* @deprecated this is now default behaviour. content is always scrollable.
* Whether the content should be wrapped in a ScrollContainer
* Only change this if you intend to manage scroll behaviour yourself
* (e.g. having a split pane with independent scrolling)
**/
scrollableContent?: boolean;
/** Callback for closing the drawer */
@ -337,6 +338,7 @@ const getStyles = (theme: GrafanaTheme2) => {
padding: theme.spacing(2),
height: '100%',
flexGrow: 1,
minHeight: 0,
}),
tabsWrapper: css({
label: 'drawer-tabs',

@ -1,6 +1,6 @@
import { waitFor } from '@testing-library/react';
import { withinQueryHistory } from './setup';
import { withinQueryHistory, withinQueryLibrary } from './setup';
export const assertQueryHistoryExists = async (query: string) => {
const selector = withinQueryHistory();
@ -23,10 +23,10 @@ export const assertQueryHistory = async (expectedQueryTexts: string[]) => {
};
export const assertQueryLibraryTemplateExists = async (datasource: string, description: string) => {
const selector = withinQueryHistory();
const selector = withinQueryLibrary();
await waitFor(() => {
const cell = selector.getByRole('cell', {
name: new RegExp(`query template for ${datasource.toLowerCase()}: ${description.toLowerCase()}`, 'i'),
const cell = selector.getByRole('radio', {
name: description,
});
expect(cell).toBeInTheDocument();

@ -43,8 +43,8 @@ export const openQueryLibrary = async () => {
const button = screen.getByRole('button', { name: 'Add query from library' });
await userEvent.click(button);
await waitFor(async () => {
screen.getByRole('tab', {
name: /query library/i,
screen.getByRole('dialog', {
name: 'Drawer title Query library',
});
});
};

@ -333,6 +333,11 @@ export const withinQueryHistory = () => {
return within(container);
};
export const withinQueryLibrary = () => {
const container = screen.getByRole('dialog', { name: 'Drawer title Query library' });
return within(container);
};
const exploreTestsHelper: { setupExplore: typeof setupExplore; tearDownExplore?: (options?: TearDownOptions) => void } =
{
setupExplore,

Loading…
Cancel
Save