diff --git a/packages/react-core/src/components/DataList/__tests__/DataList.test.tsx b/packages/react-core/src/components/DataList/__tests__/DataList.test.tsx
index a7a5bc878c1..f28b8cd6f2c 100644
--- a/packages/react-core/src/components/DataList/__tests__/DataList.test.tsx
+++ b/packages/react-core/src/components/DataList/__tests__/DataList.test.tsx
@@ -5,346 +5,182 @@ import userEvent from '@testing-library/user-event';
import { DataList } from '../DataList';
import { DataListItem } from '../DataListItem';
-import { DataListAction } from '../DataListAction';
-import { DataListCell } from '../DataListCell';
-import { DataListToggle } from '../DataListToggle';
-import { DataListItemCells } from '../DataListItemCells';
import { DataListItemRow } from '../DataListItemRow';
-import { DataListContent } from '../DataListContent';
-import { Button } from '../../Button';
-import { Dropdown, DropdownList, DropdownItem } from '../../Dropdown';
-import { MenuToggle } from '../../MenuToggle';
-import styles from '@patternfly/react-styles/css/components/DataList/data-list';
-describe('DataList', () => {
- test('List default', () => {
- const { asFragment } = render(
);
- expect(asFragment()).toMatchSnapshot();
- });
+import styles from '@patternfly/react-styles/css/components/DataList/data-list';
- test('List compact', () => {
- const { asFragment } = render(
);
- expect(asFragment()).toMatchSnapshot();
- });
+test('Renders to match snapshot', () => {
+ const { asFragment } = render(
);
+ expect(asFragment()).toMatchSnapshot();
+});
- describe('DataList variants', () => {
- ['none', 'always', 'sm', 'md', 'lg', 'xl', '2xl'].forEach((oneBreakpoint) => {
- test(`Breakpoint - ${oneBreakpoint}`, () => {
- const { asFragment } = render(
-
- );
- expect(asFragment()).toMatchSnapshot();
- });
- });
- });
+test(`Renders with default class ${styles.dataList}`, () => {
+ render(
);
+ expect(screen.getByLabelText('list')).toHaveClass(styles.dataList);
+});
- test('List draggable', () => {
- const { asFragment } = render(
);
- expect(asFragment()).toMatchSnapshot();
- });
+test(`Renders with custom class when className is passed`, () => {
+ render(
);
+ expect(screen.getByLabelText('list')).toHaveClass('custom');
+});
- test('List', () => {
- const { asFragment } = render(
-
- );
- expect(asFragment()).toMatchSnapshot();
- });
+test(`Renders with spread props`, () => {
+ render(
);
+ expect(screen.getByLabelText('list')).toHaveAttribute('id', 'test');
+});
- test('List renders with a hidden input to improve a11y when selectableRow is passed', () => {
- render(
-
{}}>
-
-
- Test
-
-
-
- );
+test(`Renders with aria-label when aria-label is passed`, () => {
+ render(
test );
+ expect(screen.getByText('test')).toHaveAccessibleName('list');
+});
- const selectableInput = screen.getByRole('radio', { hidden: true });
+test(`Renders ${styles.modifiers.compact} when isCompact = true`, () => {
+ render(
);
+ expect(screen.getByLabelText('list')).toHaveClass(styles.modifiers.compact);
+});
- expect(selectableInput).toBeInTheDocument();
+['nowrap', 'truncate', 'breakWord'].forEach((wrap) => {
+ test(`Renders with class ${styles.modifiers[wrap]} when wrapModifier = ${wrap} is pased`, () => {
+ render(
);
+ expect(screen.getByLabelText('list')).toHaveClass(styles.modifiers[wrap]);
});
+});
- test('List does not render with a hidden input to improve a11y when selectableRow is not passed', () => {
- render(
-
-
-
- Test
-
-
-
- );
-
- const selectableInput = screen.queryByRole('radio', { hidden: true });
-
- expect(selectableInput).not.toBeInTheDocument();
+const gridBreakpointClasses = {
+ none: styles.modifiers.gridNone,
+ always: 'pf-m-grid',
+ sm: styles.modifiers.gridSm,
+ md: styles.modifiers.gridMd,
+ lg: styles.modifiers.gridLg,
+ xl: styles.modifiers.gridXl,
+ '2xl': styles.modifiers.grid_2xl
+};
+
+['none', 'always', 'sm', 'md', 'lg', 'xl', '2xl'].forEach((oneBreakpoint) => {
+ test(`Has breakpoint - ${oneBreakpoint} when gridBreakpoint is pased`, () => {
+ render(
);
+ expect(screen.getByLabelText('list')).toHaveClass(gridBreakpointClasses[oneBreakpoint]);
});
+});
- test('List calls selectableRow.onChange when the selectable input changes', async () => {
- const mock = jest.fn();
- const user = userEvent.setup();
-
- render(
-
-
-
- Test
-
-
-
- );
-
- const selectableInput = screen.getByRole('radio', { hidden: true });
- await user.click(selectableInput);
+test(`Renders default class ${styles.dataList}`, () => {
+ render(
);
+ expect(screen.getByLabelText('list')).toHaveClass(styles.dataList);
+});
- expect(mock).toHaveBeenCalled();
- });
+test('Renders custom class when passed', () => {
+ render(
);
+ expect(screen.getByLabelText('list')).toHaveClass('data-list-custom');
+});
- test('List does not call selectableRow.onChange when the selectable input is not changed', () => {
- const mock = jest.fn();
+test('Renders with a hidden input to improve a11y when onSelectableRowChange is passed', () => {
+ render(
+
{}}>
+
+
+ Test
+
+
+
+ );
- render(
-
-
-
- Test
-
-
-
- );
+ const selectableInput = screen.getByRole('radio', { hidden: true });
- expect(mock).not.toHaveBeenCalled();
- });
-
- test('Item applies selectableInputAriaLabel to the hidden input', () => {
- render(
-
{}}>
-
-
- Test
-
-
-
- );
+ expect(selectableInput).toBeInTheDocument();
+});
- const selectableInput = screen.getByRole('radio', { hidden: true });
+test('Does not render with a hidden input to improve a11y when onSelectableRowChange is not passed', () => {
+ render(
+
+
+
+ Test
+
+
+
+ );
- expect(selectableInput).toHaveAccessibleName('Data list item label test');
- });
+ const selectableInput = screen.queryByRole('radio', { hidden: true });
- test('Item defaults to labelling its input using its aria-labelledby prop', () => {
- render(
-
{}}>
-
- Test cell content
-
-
- );
+ expect(selectableInput).not.toBeInTheDocument();
+});
- const selectableInput = screen.getByRole('radio', { hidden: true });
+test('Calls onSelectableRowChange when the selectable input changes', async () => {
+ const mock = jest.fn();
+ const user = userEvent.setup();
- expect(selectableInput).toHaveAccessibleName('Test cell content');
- });
+ render(
+
+
+
+ Test
+
+
+
+ );
- test('Item prioritizes selectableInputAriaLabel over aria-labelledby prop', () => {
- render(
-
{}}>
-
- Test cell content
-
-
- );
+ const selectableInput = screen.getByRole('radio', { hidden: true });
+ await user.click(selectableInput);
- const selectableInput = screen.getByRole('radio', { hidden: true });
+ expect(mock).toHaveBeenCalled();
+});
- expect(selectableInput).toHaveAccessibleName('Data list item label test');
- });
+test('Does not call onSelectableRowChange when the selectable input is not changed', () => {
+ const mock = jest.fn();
- test('Item default', () => {
- const { asFragment } = render(
-
- test
+ render(
+
+
+
+ Test
+
- );
- expect(asFragment()).toMatchSnapshot();
- });
+
+ );
- test('Item expanded', () => {
- render(
-
- test
-
- );
- expect(screen.getByRole('listitem')).toHaveClass(`${styles.dataListItem} ${styles.modifiers.expanded}`);
- });
+ expect(mock).not.toHaveBeenCalled();
+});
- test('Item', () => {
- const { asFragment } = render(
-
- test
+test('Applies selectableInputAriaLabel to the hidden input', () => {
+ render(
+ {}}>
+
+
+ Test
+
- );
- expect(asFragment()).toMatchSnapshot();
- });
-
- test('item row default', () => {
- const { asFragment } = render(test );
- expect(asFragment()).toMatchSnapshot();
- });
-
- test('Cell default', () => {
- const { asFragment } = render(Secondary );
- expect(asFragment()).toMatchSnapshot();
- });
-
- test('Cells', () => {
- const { asFragment } = render(
-
- Primary Id
- ,
-
- Primary Id 2
-
- ]}
- />
- );
- expect(asFragment()).toMatchSnapshot();
- });
-
- test('Cell with width modifier', () => {
- [
- { width: 1, class: '' },
- { width: 2, class: 'pf-m-flex-2' },
- { width: 3, class: 'pf-m-flex-3' },
- { width: 4, class: 'pf-m-flex-4' },
- { width: 5, class: 'pf-m-flex-5' }
- ].forEach((testCase, index) => {
- const testId = `cell-test-id-${index}`;
-
- render(
-
- Primary Id
-
- );
-
- const dataListCell = screen.getByTestId(testId);
-
- testCase.class === ''
- ? expect(dataListCell).toHaveClass(styles.dataListCell)
- : expect(dataListCell).toHaveClass(`${styles.dataListCell} ${testCase.class}`);
- });
- });
+
+ );
- test('Cell with text modifiers', () => {
- [
- { wrapModifier: null as any, class: '' },
- { wrapModifier: 'breakWord', class: 'pf-m-break-word' },
- { wrapModifier: 'nowrap', class: 'pf-m-nowrap' },
- { wrapModifier: 'truncate', class: 'pf-m-truncate' }
- ].forEach((testCase, index) => {
- const testId = `cell-test-id-${index}`;
-
- render(
-
- Primary Id
-
- );
-
- const dataListCell = screen.getByTestId(testId);
-
- testCase.class === ''
- ? expect(dataListCell).toHaveClass(styles.dataListCell)
- : expect(dataListCell).toHaveClass(`${styles.dataListCell} ${testCase.class}`);
- });
- });
-
- test('Toggle default with aria label', () => {
- render( {}}>
+
+ Test cell content
+
+
+ );
- test('DataListAction dropdown', () => {
- const { asFragment } = render(
-
-
-
- action-1
-
- ,
-
- action-2
-
-
-
-
- );
- expect(asFragment()).toMatchSnapshot();
- });
+ const selectableInput = screen.getByRole('radio', { hidden: true });
- test('DataListAction button', () => {
- const { asFragment } = render(
-
- Delete
-
- );
- expect(asFragment()).toMatchSnapshot();
- });
-
- test('DataListAction visibility - show button when lg', () => {
- render(
-
- Primary
-
- );
-
- expect(screen.getByRole('button').parentElement).toHaveClass('pf-m-hidden');
- expect(screen.getByRole('button').parentElement).toHaveClass('pf-m-visible-on-lg');
- });
+ expect(selectableInput).toHaveAccessibleName('Test cell content');
+});
- test('DataListAction visibility - hide button on 2xl', () => {
- render(
-
- Primary
-
- );
-
- expect(screen.getByRole('button').parentElement).toHaveClass('pf-m-hidden-on-2xl');
- });
+test('Prioritizes selectableInputAriaLabel over aria-labelledby prop', () => {
+ render(
+ {}}>
+
+ Test cell content
+
+
+ );
- test('DataListContent', () => {
- const { asFragment } = render( test );
- expect(asFragment()).toMatchSnapshot();
- });
+ const selectableInput = screen.getByRole('radio', { hidden: true });
- test('DataListContent hasNoPadding', () => {
- const { asFragment } = render(
-
- test
-
- );
- expect(asFragment()).toMatchSnapshot();
- });
+ expect(selectableInput).toHaveAccessibleName('Data list item label test');
});
diff --git a/packages/react-core/src/components/DataList/__tests__/DataListAction.test.tsx b/packages/react-core/src/components/DataList/__tests__/DataListAction.test.tsx
new file mode 100644
index 00000000000..38745263caa
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/DataListAction.test.tsx
@@ -0,0 +1,75 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DataListAction } from '../DataListAction';
+
+import styles from '@patternfly/react-styles/css/components/DataList/data-list';
+
+test('Renders to match snapshot', () => {
+ const { asFragment } = render(
+
+ test
+
+ );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders with default class ${styles.dataListItemAction}`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByText('test')).toHaveClass(styles.dataListItemAction, { exact: true });
+});
+
+test(`Renders with custom class when className is passed`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByText('test')).toHaveClass('test-class');
+});
+
+test(`Renders with spread props`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByText('test')).toHaveAttribute('dir', 'rtl');
+});
+
+test(`Renders with class ${styles.dataListAction} when isPlainButtonAction = true`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByText('test')).toHaveClass(styles.dataListAction);
+});
+
+['hidden', 'visible'].forEach((vis) => {
+ const visMod = vis as 'hidden' | 'visible';
+ test(`Has visibility - ${vis} for every breakpoint`, () => {
+ render(
+
+ test
+
+ );
+
+ if (visMod === 'hidden') {
+ expect(screen.getByText('test')).toHaveClass(styles.modifiers[`${visMod}`]);
+ }
+ expect(screen.getByText('test')).toHaveClass(styles.modifiers[`${visMod}OnSm`]);
+ expect(screen.getByText('test')).toHaveClass(styles.modifiers[`${visMod}OnMd`]);
+ expect(screen.getByText('test')).toHaveClass(styles.modifiers[`${visMod}OnLg`]);
+ expect(screen.getByText('test')).toHaveClass(styles.modifiers[`${visMod}OnXl`]);
+ expect(screen.getByText('test')).toHaveClass(styles.modifiers[`${visMod}On_2xl`]);
+ });
+});
diff --git a/packages/react-core/src/components/DataList/__tests__/DataListCell.test.tsx b/packages/react-core/src/components/DataList/__tests__/DataListCell.test.tsx
new file mode 100644
index 00000000000..6e5954384fa
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/DataListCell.test.tsx
@@ -0,0 +1,120 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DataListCell } from '../DataListCell';
+
+import styles from '@patternfly/react-styles/css/components/DataList/data-list';
+
+test('Cell renders to match snapshot', () => {
+ const { asFragment } = render(Secondary );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders default class ${styles.dataListCell}`, () => {
+ render(
+
+ Primary Id
+
+ );
+ expect(screen.getByTestId('test')).toHaveClass(styles.dataListCell, { exact: true });
+});
+
+test(`Renders custom class when className is passed`, () => {
+ render(
+
+ Primary Id
+
+ );
+ expect(screen.getByTestId('test')).toHaveClass('test-class');
+});
+
+test(`Renders with spread props`, () => {
+ render(
+
+ Primary Id
+
+ );
+ expect(screen.getByText('Primary Id')).toHaveAttribute('id', 'test');
+});
+
+test('Renders width modifier when width is passed', () => {
+ [
+ { width: 1, class: '' },
+ { width: 2, class: styles.modifiers.flex_2 },
+ { width: 3, class: styles.modifiers.flex_3 },
+ { width: 4, class: styles.modifiers.flex_4 },
+ { width: 5, class: styles.modifiers.flex_5 }
+ ].forEach((testCase, index) => {
+ const testId = `cell-test-id-${index}`;
+
+ render(
+
+ Primary Id
+
+ );
+
+ const dataListCell = screen.getByTestId(testId);
+
+ testCase.class === ''
+ ? expect(dataListCell).not.toHaveClass(
+ styles.modifiers.flex_2,
+ styles.modifiers.flex_3,
+ styles.modifiers.flex_4,
+ styles.modifiers.flex_5
+ )
+ : expect(dataListCell).toHaveClass(`pf-v5-c-data-list__cell ${testCase.class}`, { exact: true });
+ });
+});
+
+test('Has text wrap modifiers when wrapModifier is passed', () => {
+ [
+ { wrapModifier: null as any, class: '' },
+ { wrapModifier: 'breakWord', class: styles.modifiers.breakWord },
+ { wrapModifier: 'nowrap', class: styles.modifiers.nowrap },
+ { wrapModifier: 'truncate', class: styles.modifiers.truncate }
+ ].forEach((testCase, index) => {
+ const testId = `cell-test-id-${index}`;
+
+ render(
+
+ Primary Id
+
+ );
+
+ const dataListCell = screen.getByTestId(testId);
+
+ testCase.class === ''
+ ? expect(dataListCell).not.toHaveClass(
+ styles.modifiers.breakWord,
+ styles.modifiers.nowrap,
+ styles.modifiers.truncate
+ )
+ : expect(dataListCell).toHaveClass(`${testCase.class}`);
+ });
+});
+
+test(`Renders with class ${styles.modifiers.alignRight} when alignRight is passed`, () => {
+ render(
+
+ Primary Id
+
+ );
+ expect(screen.getByTestId('test')).toHaveClass(styles.modifiers.alignRight);
+});
+
+test(`Renders with class ${styles.modifiers.icon} when isIcon is passed`, () => {
+ render(
+
+ Primary Id
+
+ );
+ expect(screen.getByTestId('test')).toHaveClass(styles.modifiers.icon);
+});
+
+test(`Renders with class ${styles.modifiers.noFill} when isFilled = false`, () => {
+ render(
+
+ Primary Id
+
+ );
+ expect(screen.getByTestId('test')).toHaveClass(styles.modifiers.noFill);
+});
diff --git a/packages/react-core/src/components/DataList/__tests__/DataListCheck.test.tsx b/packages/react-core/src/components/DataList/__tests__/DataListCheck.test.tsx
index 9e69ff734e8..fa1424c746f 100644
--- a/packages/react-core/src/components/DataList/__tests__/DataListCheck.test.tsx
+++ b/packages/react-core/src/components/DataList/__tests__/DataListCheck.test.tsx
@@ -3,6 +3,11 @@ import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { DataListCheck } from '../DataListCheck';
+test(`Renders with spread props`, () => {
+ render( test );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders with default class ${styles.dataListExpandableContent}`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByTestId('test-id')).toHaveClass(styles.dataListExpandableContent, { exact: true });
+});
+
+test(`Renders with default class ${styles.dataListExpandableContentBody}`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByText('test')).toHaveClass(styles.dataListExpandableContentBody, { exact: true });
+});
+
+test(`Renders with custom class when className is passed`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByTestId('test-id')).toHaveClass('test-class');
+});
+
+test(`Renders with id when id is passed`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByTestId('test-id')).toHaveAttribute('id', 'idProp');
+});
+
+test(`Renders with spread props`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByTestId('test-id')).toHaveAttribute('dir', 'rtl');
+});
+
+test(`Renders with class ${styles.modifiers.noPadding} when hasNoPadding is passed`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByText('test')).toHaveClass(styles.modifiers.noPadding);
+});
+
+test(`Renders with hidden property when isHidden is passed`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByTestId('test-id')).toHaveAttribute('hidden');
+});
diff --git a/packages/react-core/src/components/DataList/__tests__/DataListItem.test.tsx b/packages/react-core/src/components/DataList/__tests__/DataListItem.test.tsx
new file mode 100644
index 00000000000..54f358c8e83
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/DataListItem.test.tsx
@@ -0,0 +1,46 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DataListItem } from '../DataListItem';
+
+import styles from '@patternfly/react-styles/css/components/DataList/data-list';
+
+test('Renders to match snapshot', () => {
+ const { asFragment } = render(
+
+ test
+
+ );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders with default class ${styles.dataListItem}`, () => {
+ render(test );
+ expect(screen.getByRole('listitem')).toHaveClass(styles.dataListItem, { exact: true });
+});
+
+test('Renders with custom class name', () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByRole('listitem')).toHaveClass('data-list-item-custom');
+});
+
+test('Renders with spread props', () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByRole('listitem')).toHaveAttribute('dir', 'rtl');
+});
+
+test(`Renders class ${styles.modifiers.expanded} when isExpanded is passed`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByRole('listitem')).toHaveClass(styles.modifiers.expanded);
+});
diff --git a/packages/react-core/src/components/DataList/__tests__/DataListItemCells.test.tsx b/packages/react-core/src/components/DataList/__tests__/DataListItemCells.test.tsx
new file mode 100644
index 00000000000..e8419f2b361
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/DataListItemCells.test.tsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DataListItemCells } from '../DataListItemCells';
+
+import styles from '@patternfly/react-styles/css/components/DataList/data-list';
+
+test('Cells renders to match snapshot', () => {
+ const { asFragment } = render(test );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders with default class ${styles.dataListItemRow}`, () => {
+ render(test );
+ expect(screen.getByTestId('test')).toHaveClass(styles.dataListItemRow, { exact: true });
+});
+
+test(`Renders with custom class when className is passed`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByTestId('test')).toHaveClass('custom');
+});
+
+test(`Renders with spread props`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByTestId('test')).toHaveAttribute('dir', 'rtl');
+});
+
+['nowrap', 'truncate', 'breakWord'].forEach((wrap) => {
+ test(`Renders with class ${styles.modifiers[wrap]} when wrapModifier = ${wrap} is pased`, () => {
+ render(
+
+ test
+
+ );
+ expect(screen.getByTestId('test')).toHaveClass(styles.modifiers[wrap]);
+ });
+});
diff --git a/packages/react-core/src/components/DataList/__tests__/DataListToggle.test.tsx b/packages/react-core/src/components/DataList/__tests__/DataListToggle.test.tsx
new file mode 100644
index 00000000000..8f7f8b4cd9b
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/DataListToggle.test.tsx
@@ -0,0 +1,61 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DataListToggle } from '../DataListToggle';
+
+import styles from '@patternfly/react-styles/css/components/DataList/data-list';
+
+test('Renders to match snapshot', () => {
+ const { asFragment } = render(
-
- Secondary
-
-
-`;
-
-exports[`DataList Cells 1`] = `
-
-
-
- Primary Id
-
-
- Primary Id 2
-
-
-`;
-
-exports[`DataList DataList variants Breakpoint - 2xl 1`] = `
-
-
-
-`;
-
-exports[`DataList DataList variants Breakpoint - always 1`] = `
-
-
-
-`;
-
-exports[`DataList DataList variants Breakpoint - lg 1`] = `
-
-
-
-`;
-
-exports[`DataList DataList variants Breakpoint - md 1`] = `
-
-
-
-`;
-
-exports[`DataList DataList variants Breakpoint - none 1`] = `
-
-
-
-`;
-
-exports[`DataList DataList variants Breakpoint - sm 1`] = `
-
-
-
-`;
-
-exports[`DataList DataList variants Breakpoint - xl 1`] = `
-
-
-
-`;
-
-exports[`DataList DataListAction button 1`] = `
-
-
-
- Delete
-
-
-
-`;
-
-exports[`DataList DataListAction dropdown 1`] = `
-
-
-
-`;
-
-exports[`DataList DataListContent 1`] = `
-
-
-
-`;
-
-exports[`DataList DataListContent hasNoPadding 1`] = `
-
-
-
-`;
-
-exports[`DataList Item 1`] = `
-
-
-`;
-
-exports[`DataList Item default 1`] = `
-
-
-`;
-
-exports[`DataList List 1`] = `
-
-
-
-`;
-
-exports[`DataList List compact 1`] = `
+exports[`Renders to match snapshot 1`] = `
-
-`;
-
-exports[`DataList List default 1`] = `
-
-
`;
-
-exports[`DataList List draggable 1`] = `
-
-
-
-`;
-
-exports[`DataList item row default 1`] = `
-
-
-
-`;
diff --git a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListAction.test.tsx.snap b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListAction.test.tsx.snap
new file mode 100644
index 00000000000..cf61bf5eabf
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListAction.test.tsx.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+ test
+
+
+`;
diff --git a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListCell.test.tsx.snap b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListCell.test.tsx.snap
new file mode 100644
index 00000000000..8dfb9393730
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListCell.test.tsx.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Cell renders to match snapshot 1`] = `
+
+
+ Secondary
+
+
+`;
diff --git a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListContent.test.tsx.snap b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListContent.test.tsx.snap
new file mode 100644
index 00000000000..15736a7aa11
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListContent.test.tsx.snap
@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+
+`;
diff --git a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItem.test.tsx.snap b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItem.test.tsx.snap
new file mode 100644
index 00000000000..1f0da0b84eb
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItem.test.tsx.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+`;
diff --git a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItemCells.test.tsx.snap b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItemCells.test.tsx.snap
new file mode 100644
index 00000000000..05d99f283e7
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItemCells.test.tsx.snap
@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Cells renders to match snapshot 1`] = `
+
+
+
+`;
diff --git a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItemRow.test.tsx.snap b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItemRow.test.tsx.snap
new file mode 100644
index 00000000000..bacaa0a7320
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListItemRow.test.tsx.snap
@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Item row renders to match snapshot 1`] = `
+
+
+
+`;
diff --git a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListToggle.test.tsx.snap b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListToggle.test.tsx.snap
new file mode 100644
index 00000000000..cd3276482cf
--- /dev/null
+++ b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataListToggle.test.tsx.snap
@@ -0,0 +1,45 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+
+`;
diff --git a/packages/react-core/src/components/DataList/examples/DataListCheckboxes.tsx b/packages/react-core/src/components/DataList/examples/DataListCheckboxes.tsx
index c4eb52d718c..8f3ca384ddd 100644
--- a/packages/react-core/src/components/DataList/examples/DataListCheckboxes.tsx
+++ b/packages/react-core/src/components/DataList/examples/DataListCheckboxes.tsx
@@ -166,8 +166,8 @@ export const DataListCheckboxes: React.FunctionComponent = () => {
Primary
@@ -192,7 +192,7 @@ export const DataListCheckboxes: React.FunctionComponent = () => {
@@ -231,8 +231,8 @@ export const DataListCheckboxes: React.FunctionComponent = () => {
Primary
diff --git a/packages/react-core/src/components/DataList/examples/DataListMixedExpandable.tsx b/packages/react-core/src/components/DataList/examples/DataListMixedExpandable.tsx
index 87648fdc0ed..7f6a33c6b9b 100644
--- a/packages/react-core/src/components/DataList/examples/DataListMixedExpandable.tsx
+++ b/packages/react-core/src/components/DataList/examples/DataListMixedExpandable.tsx
@@ -162,7 +162,7 @@ export const DataListMixedExpandable: React.FunctionComponent = () => {
]}
/>
Date: Wed, 15 Nov 2023 09:32:01 -0600
Subject: [PATCH 30/41] bug(ClipboardCopy): change children type to string
(#9743)
* bug(ClipboardCopy): change children type to string
Signed-off-by: gitdallas
* fix clipboardcopyexpanded to work with string children
Signed-off-by: gitdallas
* refactor a bit
* fix bad rebase
---------
Signed-off-by: gitdallas
---
.../src/components/ClipboardCopy/ClipboardCopy.tsx | 10 +++++-----
.../components/ClipboardCopy/ClipboardCopyExpanded.tsx | 1 -
2 files changed, 5 insertions(+), 6 deletions(-)
diff --git a/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx b/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx
index 1ad5059fed3..142fb4bed37 100644
--- a/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx
+++ b/packages/react-core/src/components/ClipboardCopy/ClipboardCopy.tsx
@@ -10,7 +10,7 @@ import { ClipboardCopyToggle } from './ClipboardCopyToggle';
import { ClipboardCopyExpanded } from './ClipboardCopyExpanded';
import { getOUIAProps, OUIAProps } from '../../helpers';
-export const clipboardCopyFunc = (event: React.ClipboardEvent, text?: React.ReactNode) => {
+export const clipboardCopyFunc = (event: React.ClipboardEvent, text?: string) => {
navigator.clipboard.writeText(text.toString());
};
@@ -27,7 +27,7 @@ export interface ClipboardCopyState {
textWhenExpanded: string;
}
-export interface ClipboardCopyProps extends Omit, 'onChange'>, OUIAProps {
+export interface ClipboardCopyProps extends Omit, 'onChange' | 'children'>, OUIAProps {
/** Additional classes added to the clipboard copy container. */
className?: string;
/** Tooltip message to display when hover the copy button */
@@ -71,12 +71,12 @@ export interface ClipboardCopyProps extends Omit
/** Delay in ms before the tooltip appears. */
entryDelay?: number;
/** A function that is triggered on clicking the copy button. */
- onCopy?: (event: React.ClipboardEvent, text?: React.ReactNode) => void;
+ onCopy?: (event: React.ClipboardEvent, text?: string) => void;
/** A function that is triggered on changing the text. */
onChange?: (event: React.FormEvent, text?: string) => void;
/** The text which is copied. */
- children: React.ReactNode;
- /** Additional actions for inline-compact clipboard copy. Should be wrapped with ClipboardCopyAction. */
+ children: string;
+ /** Additional actions for inline clipboard copy. Should be wrapped with ClipboardCopyAction. */
additionalActions?: React.ReactNode;
/** Value to overwrite the randomly generated data-ouia-component-id.*/
ouiaId?: number | string;
diff --git a/packages/react-core/src/components/ClipboardCopy/ClipboardCopyExpanded.tsx b/packages/react-core/src/components/ClipboardCopy/ClipboardCopyExpanded.tsx
index 8a82c3e0001..0c805495078 100644
--- a/packages/react-core/src/components/ClipboardCopy/ClipboardCopyExpanded.tsx
+++ b/packages/react-core/src/components/ClipboardCopy/ClipboardCopyExpanded.tsx
@@ -6,7 +6,6 @@ import { PickOptional } from '../../helpers/typeUtils';
export interface ClipboardCopyExpandedProps extends Omit {
className?: string;
- children: React.ReactNode;
onChange?: (e: React.FormEvent, text: string) => void;
isReadOnly?: boolean;
isCode?: boolean;
From 88e1c34c8cc1bfd73875bd3290d87f1cd34723cc Mon Sep 17 00:00:00 2001
From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com>
Date: Wed, 15 Nov 2023 11:29:32 -0500
Subject: [PATCH 31/41] chore(deps): update devdependencies (#9817)
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
---
yarn.lock | 56 +++++++++++++++++++++++++++++++++----------------------
1 file changed, 34 insertions(+), 22 deletions(-)
diff --git a/yarn.lock b/yarn.lock
index b4c9a53607d..fcda0e9ab6c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3825,10 +3825,10 @@
node-addon-api "^3.2.1"
node-gyp-build "^4.3.0"
-"@patternfly/ast-helpers@^1.3.2":
- version "1.3.2"
- resolved "https://registry.yarnpkg.com/@patternfly/ast-helpers/-/ast-helpers-1.3.2.tgz#7f53e3d4481dcf035eb189031858d8eb53fc0def"
- integrity sha512-vNIp3dXqaFDm2aBigkKxpbAezlKMolW3BTS5LfdwuAPAdduGx068o6b/duvmKr86bJXBW8i5ljr+e+Jau5/3oQ==
+"@patternfly/ast-helpers@^1.3.6":
+ version "1.3.6"
+ resolved "https://registry.yarnpkg.com/@patternfly/ast-helpers/-/ast-helpers-1.3.6.tgz#b8b45e8dbfc802b0ebf35976948d30834ac2a432"
+ integrity sha512-dj3x+jQpeBamSiNSDq6EMPB6Q+1myzFYVBBai12FpqhrnYCkOjTGDok8VflBo5tOVLKuTdhBNbvkd7V7c0DRvw==
dependencies:
acorn "^8.4.1"
acorn-class-fields "^1.0.0"
@@ -3837,9 +3837,9 @@
astring "^1.7.5"
"@patternfly/documentation-framework@^5.0.15":
- version "5.3.2"
- resolved "https://registry.yarnpkg.com/@patternfly/documentation-framework/-/documentation-framework-5.3.2.tgz#899021b0fcca952429c24bc14043cb1d24ea71e6"
- integrity sha512-5mg1VYVRC4lXsiAIP0fv7OzlNw1fORyRtBv8B34uAe3zZvfLB5/wd/2lZkf97DfH/VSKQdzV4DGDSKx5IOdZkA==
+ version "5.3.6"
+ resolved "https://registry.yarnpkg.com/@patternfly/documentation-framework/-/documentation-framework-5.3.6.tgz#eb3b2793376fd6a832243353b5e7a6b32ac67a63"
+ integrity sha512-u8jUZ7YpGfF5kjMo9bJHw40Fo6twVHRZOeKrtMLqZMjIaSMI1B/etNG4fcIKr93Q1DxKQ1c3OcYvHv4Nd5KPIA==
dependencies:
"@babel/core" "7.18.2"
"@babel/plugin-proposal-class-properties" "7.17.12"
@@ -3849,7 +3849,7 @@
"@babel/plugin-transform-react-jsx" "7.17.12"
"@babel/preset-env" "7.18.2"
"@mdx-js/util" "1.6.16"
- "@patternfly/ast-helpers" "^1.3.2"
+ "@patternfly/ast-helpers" "^1.3.6"
"@reach/router" "npm:@gatsbyjs/reach-router@1.3.9"
autoprefixer "9.8.6"
babel-loader "9.1.2"
@@ -4444,9 +4444,9 @@
integrity sha512-cxWFQVseBm6O9Gbw1IWb8r6OS4OhSt3hPZLkFApLjM8TEXROBuQGLAH2i2gZpcXdLBIrpXuTDhH7Vbm1iXmNGA==
"@types/json-schema@^7.0.9":
- version "7.0.12"
- resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.12.tgz#d70faba7039d5fca54c83c7dbab41051d2b6f6cb"
- integrity sha512-Hr5Jfhc9eYOQNPYO5WLDq/n4jqijdHNlDXjuAQkkt+mWdQR+XJToOHrsD4cPaMXpn6KO7y2+wM8AZEs8VpBLVA==
+ version "7.0.15"
+ resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.15.tgz#596a1747233694d50f6ad8a7869fcb6f56cf5841"
+ integrity sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==
"@types/json5@^0.0.29":
version "0.0.29"
@@ -4589,9 +4589,9 @@
integrity sha512-Vlktnchmkylvc9SnwwwozTv04L/e1NykF5vgoQ0XTmI8DD+wxfjQuHuvHS3p0r2jz2x2ghPs2h1FVeDirIteWA==
"@types/semver@^7.3.12":
- version "7.5.0"
- resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.0.tgz#591c1ce3a702c45ee15f47a42ade72c2fd78978a"
- integrity sha512-G8hZ6XJiHnuhQKR7ZmysCeJWE08o8T0AXtk5darsCaTVsYZhhgUrq53jizaR2FvsoeCwJhlmwTjkXBY5Pn/ZHw==
+ version "7.5.5"
+ resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.5.tgz#deed5ab7019756c9c90ea86139106b0346223f35"
+ integrity sha512-+d+WYC1BxJ6yVOgUgzK8gWvp5qF8ssV5r4nsDcZWKRWcDQLQ619tvWAxJQYGgBrO1MnLJC7a5GtiYsAoQ47dJg==
"@types/serve-index@^1.9.1":
version "1.9.1"
@@ -9165,9 +9165,9 @@ eslint-plugin-standard@^4.0.0:
integrity sha512-ZL7+QRixjTR6/528YNGyDotyffm5OQst/sGxKDwGb9Uqs4In5Egi4+jbobhqJoyoCM6/7v/1A5fhQ7ScMtDjaQ==
eslint-plugin-testing-library@^6.1.0:
- version "6.1.0"
- resolved "https://registry.yarnpkg.com/eslint-plugin-testing-library/-/eslint-plugin-testing-library-6.1.0.tgz#6f4fbc50dfbac100b0c6083b1e6b06cea9a86feb"
- integrity sha512-r7kE+az3tbp8vyRwfyAGZ6V/xw+XvdWFPicIo6jbOPZoossOFDeHizARqPGV6gEkyF8hyCFhhH3mlQOGS3N5Sg==
+ version "6.1.2"
+ resolved "https://registry.yarnpkg.com/eslint-plugin-testing-library/-/eslint-plugin-testing-library-6.1.2.tgz#3e71e5cd5b09f5c443b7136cec97a6fb13ecbf66"
+ integrity sha512-Ra16FeBlonfbScOIdZEta9o+OxtwDqiUt+4UCpIM42TuatyLdtfU/SbwnIzPcAszrbl58PGwyZ9YGU9dwIo/tA==
dependencies:
"@typescript-eslint/utils" "^5.58.0"
@@ -9289,7 +9289,8 @@ esrecurse@^4.1.0, esrecurse@^4.3.0:
estraverse@^4.1.1, estraverse@^4.2.0:
version "4.3.0"
- resolved "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz"
+ resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.3.0.tgz#398ad3f3c5a24948be7725e83d11a7de28cdbd1d"
+ integrity sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==
estraverse@^5.1.0, estraverse@^5.2.0, estraverse@^5.3.0:
version "5.3.0"
@@ -9656,7 +9657,18 @@ fast-glob@^3.2.11:
merge2 "^1.3.0"
micromatch "^4.0.4"
-fast-glob@^3.2.9, fast-glob@^3.3.0:
+fast-glob@^3.2.9:
+ version "3.3.2"
+ resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.2.tgz#a904501e57cfdd2ffcded45e99a54fef55e46129"
+ integrity sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==
+ dependencies:
+ "@nodelib/fs.stat" "^2.0.2"
+ "@nodelib/fs.walk" "^1.2.3"
+ glob-parent "^5.1.2"
+ merge2 "^1.3.0"
+ micromatch "^4.0.4"
+
+fast-glob@^3.3.0:
version "3.3.1"
resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.1.tgz#784b4e897340f3dbbef17413b3f11acf03c874c4"
integrity sha512-kNFPyjhh5cKjrUltxs+wFx+ZkbRaxxmZ+X0ZU31SOsxCEtP9VPgtq2teZw1DebupL5GmDaNQ6yKMMVcM41iqDg==
@@ -16052,9 +16064,9 @@ prettier-linter-helpers@^1.0.0:
fast-diff "^1.1.2"
prettier@^3.0.0:
- version "3.0.3"
- resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.0.3.tgz#432a51f7ba422d1469096c0fdc28e235db8f9643"
- integrity sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==
+ version "3.1.0"
+ resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.1.0.tgz#c6d16474a5f764ea1a4a373c593b779697744d5e"
+ integrity sha512-TQLvXjq5IAibjh8EpBIkNKxO749UEWABoiIZehEPiY4GNpVdhaFKqSTu+QrlU6D2dPAfubRmtJTi4K4YkQ5eXw==
pretty-bytes@^5.6.0:
version "5.6.0"
From 4b23675aac66a9c7135ad0eae362a5b3a74b704c Mon Sep 17 00:00:00 2001
From: Maria
Date: Wed, 15 Nov 2023 19:56:52 +0100
Subject: [PATCH 32/41] fix Search Input - composable advanced search demo
(#9484)
* Search Input - composable advanced search fix date
* remove isFill from datePicker
---
packages/react-core/src/components/DatePicker/DatePicker.tsx | 2 +-
.../__tests__/__snapshots__/DatePicker.test.tsx.snap | 4 ++--
packages/react-core/src/demos/SearchInput/SearchInput.md | 2 +-
3 files changed, 4 insertions(+), 4 deletions(-)
diff --git a/packages/react-core/src/components/DatePicker/DatePicker.tsx b/packages/react-core/src/components/DatePicker/DatePicker.tsx
index 9626eaaa171..190e4d158e2 100644
--- a/packages/react-core/src/components/DatePicker/DatePicker.tsx
+++ b/packages/react-core/src/components/DatePicker/DatePicker.tsx
@@ -285,7 +285,7 @@ const DatePickerBase = (
>
-
+
}>
+ help test text
+
+ );
+ expect(screen.getByText('test').parentElement).toHaveClass(styles.helperTextItemIcon);
+});
+
+test('Renders dynamic helper text', () => {
+ render(help test text );
+ expect(screen.getByText('help test text').parentElement).toHaveClass(styles.modifiers.dynamic);
+ expect(screen.getByText('help test text').querySelector('span')).toHaveClass('pf-v5-screen-reader');
+});
+
+test('Renders custom screenreader text when isDynamic = true and screenReaderText is passed', () => {
+ render(
+
+ help test text
+
+ );
+ expect(screen.getByText('help test text').querySelector('span')).toHaveTextContent('sr test');
+});
diff --git a/packages/react-core/src/components/HelperText/__tests__/__snapshots__/HelperText.test.tsx.snap b/packages/react-core/src/components/HelperText/__tests__/__snapshots__/HelperText.test.tsx.snap
index bc7fa094120..80d9d88b05f 100644
--- a/packages/react-core/src/components/HelperText/__tests__/__snapshots__/HelperText.test.tsx.snap
+++ b/packages/react-core/src/components/HelperText/__tests__/__snapshots__/HelperText.test.tsx.snap
@@ -1,230 +1,9 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`HelperText default helper text variant applies successfully 1`] = `
+exports[`Renders to match snapshot 1`] = `
-
- default help test text
-
-
-
-`;
-
-exports[`HelperText dynamic helper text renders successfully 1`] = `
-
-
-
-
-
-
-
-
- help test text
-
- : default status;
-
-
-
-
-`;
-
-exports[`HelperText helper text block renders successfully 1`] = `
-
-
-
-
- help test text 1
-
-
-
-
- help test text 2
-
-
-
-
- help test text 3
-
-
-
-`;
-
-exports[`HelperText icon helper text renders properly 1`] = `
-
-
-
-
-
-
-
-
- help test text
-
-
-
-`;
-
-exports[`HelperText indeterminate helper text variant applies successfully 1`] = `
-
-
-
- indeterminate help test text
-
-
-
-`;
-
-exports[`HelperText invalid helper text variant applies successfully 1`] = `
-
-
-
- invalid help test text
-
-
-
-`;
-
-exports[`HelperText simple helper text renders successfully 1`] = `
-
-
-
-
- help test text
-
-
-
-`;
-
-exports[`HelperText success helper text variant applies successfully 1`] = `
-
-
-
- success help test text
-
-
-
-`;
-
-exports[`HelperText variant comonent helper text renders properly 1`] = `
-
-
-
-
- help test text 1
-
-
-
-
- help test text 2
-
-
-
-
-`;
-
-exports[`HelperText warning helper text variant applies successfully 1`] = `
-
-
-
- warning help test text
-
-
+ />
`;
diff --git a/packages/react-core/src/components/HelperText/__tests__/__snapshots__/HelperTextItem.test.tsx.snap b/packages/react-core/src/components/HelperText/__tests__/__snapshots__/HelperTextItem.test.tsx.snap
new file mode 100644
index 00000000000..a06fcc63aaa
--- /dev/null
+++ b/packages/react-core/src/components/HelperText/__tests__/__snapshots__/HelperTextItem.test.tsx.snap
@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+
+ help test text
+
+
+
+`;
From 18c140a2adcc1833e4b095755aa7495d1d88a177 Mon Sep 17 00:00:00 2001
From: kmcfaul <45077788+kmcfaul@users.noreply.github.com>
Date: Thu, 16 Nov 2023 08:27:50 -0500
Subject: [PATCH 35/41] fix(Chip): update tooltip vis when chip updates (#9819)
* fix(Chip): enable tooltip when chip updates
* fix casting
---
packages/react-core/src/components/Chip/Chip.tsx | 11 +++++++++++
1 file changed, 11 insertions(+)
diff --git a/packages/react-core/src/components/Chip/Chip.tsx b/packages/react-core/src/components/Chip/Chip.tsx
index 52c6c62d518..12ab24e665c 100644
--- a/packages/react-core/src/components/Chip/Chip.tsx
+++ b/packages/react-core/src/components/Chip/Chip.tsx
@@ -81,6 +81,17 @@ class Chip extends React.Component {
});
}
+ componentDidUpdate(_prevProps: ChipProps, prevState: ChipState) {
+ const nextIsTooltipVisible = Boolean(
+ this.span.current && this.span.current.offsetWidth < this.span.current.scrollWidth
+ );
+ if (prevState.isTooltipVisible !== nextIsTooltipVisible) {
+ this.setState({
+ isTooltipVisible: nextIsTooltipVisible
+ });
+ }
+ }
+
setChipStyle = () => ({
[cssChipTextMaxWidth.name]: this.props.textMaxWidth
});
From b957f2fc59c886e6569f1e8a94ff6c1069fb528f Mon Sep 17 00:00:00 2001
From: kmcfaul <45077788+kmcfaul@users.noreply.github.com>
Date: Thu, 16 Nov 2023 12:00:00 -0500
Subject: [PATCH 36/41] chore(DescriptionList): update tests (#9753)
* chore(DescriptionList): update tests
* break out tests, pr feedback
* updates
* add autofit width mod test
---
.../__tests__/DescriptionList.test.tsx | 230 ++++++++++--------
.../DescriptionListDescription.test.tsx | 25 ++
.../__tests__/DescriptionListGroup.test.tsx | 25 ++
.../DescriptionListHelpTextButton.test.tsx | 27 ++
.../__tests__/DescriptionListTerm.test.tsx | 35 +++
.../DescriptionListTermHelpText.test.tsx | 25 ++
.../DescriptionList.test.tsx.snap | 158 +-----------
.../DescriptionListDescription.test.tsx.snap | 15 ++
.../DescriptionListGroup.test.tsx.snap | 11 +
...escriptionListHelpTextButton.test.tsx.snap | 14 ++
.../DescriptionListTerm.test.tsx.snap | 15 ++
.../DescriptionListTermHelpText.test.tsx.snap | 11 +
12 files changed, 332 insertions(+), 259 deletions(-)
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/DescriptionListDescription.test.tsx
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/DescriptionListGroup.test.tsx
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/DescriptionListHelpTextButton.test.tsx
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/DescriptionListTerm.test.tsx
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/DescriptionListTermHelpText.test.tsx
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListDescription.test.tsx.snap
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListGroup.test.tsx.snap
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListHelpTextButton.test.tsx.snap
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListTerm.test.tsx.snap
create mode 100644 packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListTermHelpText.test.tsx.snap
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/DescriptionList.test.tsx b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionList.test.tsx
index 22431afd832..67f76a232b8 100644
--- a/packages/react-core/src/components/DescriptionList/__tests__/DescriptionList.test.tsx
+++ b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionList.test.tsx
@@ -1,130 +1,156 @@
import React from 'react';
-import { render } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
import { DescriptionList } from '../DescriptionList';
-import { DescriptionListGroup } from '../DescriptionListGroup';
-import { DescriptionListTerm } from '../DescriptionListTerm';
-import { DescriptionListDescription } from '../DescriptionListDescription';
-import { DescriptionListTermHelpText } from '../DescriptionListTermHelpText';
-import { DescriptionListTermHelpTextButton } from '../DescriptionListTermHelpTextButton';
-
-describe('Description List', () => {
- test('default', () => {
- const { asFragment } = render(
- test
-
- );
- expect(asFragment()).toMatchSnapshot();
- });
+test(`Renders ${styles.modifiers.displayLg} when displaySize = lg`, () => {
+ render(
- test
-
- );
- expect(asFragment()).toMatchSnapshot();
- });
+test(`Renders ${styles.modifiers.display_2xl} when displaySize = 2xl`, () => {
+ render(
- test
-
- );
- expect(asFragment()).toMatchSnapshot();
+test(`Renders style when isHorizontal and horizontalTermWidthModifier is set`, () => {
+ render(
+
- test
-
- );
- expect(asFragment()).toMatchSnapshot();
+test(`Renders style when termWidth is set`, () => {
+ render(test );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders default class ${styles.descriptionListDescription}`, () => {
+ render(test );
+ expect(screen.getByText('test').parentElement).toHaveClass(styles.descriptionListDescription, { exact: true });
+});
+
+test('Renders custom className', () => {
+ render(test );
+ expect(screen.getByText('test').parentElement).toHaveClass('custom');
+});
+
+test('Renders spread props', () => {
+ render(test );
+ expect(screen.getByText('test').parentElement).toHaveAttribute('id', 'id');
+});
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListGroup.test.tsx b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListGroup.test.tsx
new file mode 100644
index 00000000000..53e84b545ff
--- /dev/null
+++ b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListGroup.test.tsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DescriptionListGroup } from '../DescriptionListGroup';
+
+import styles from '@patternfly/react-styles/css/components/DescriptionList/description-list';
+
+test('Renders to match snapshot', () => {
+ const { asFragment } = render(test );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders default class ${styles.descriptionListGroup}`, () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveClass(styles.descriptionListGroup, { exact: true });
+});
+
+test('Renders custom className', () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveClass('custom');
+});
+
+test('Renders spread props', () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveAttribute('id', 'id');
+});
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListHelpTextButton.test.tsx b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListHelpTextButton.test.tsx
new file mode 100644
index 00000000000..bb49c585450
--- /dev/null
+++ b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListHelpTextButton.test.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DescriptionListTermHelpTextButton } from '../DescriptionListTermHelpTextButton';
+
+import styles from '@patternfly/react-styles/css/components/DescriptionList/description-list';
+
+test('Renders to match snapshot', () => {
+ const { asFragment } = render(test );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders default class ${styles.descriptionListText}`, () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveClass(`${styles.descriptionListText} ${styles.modifiers.helpText}`, {
+ exact: true
+ });
+});
+
+test('Renders custom className', () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveClass('custom');
+});
+
+test('Renders spread props', () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveAttribute('id', 'id');
+});
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListTerm.test.tsx b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListTerm.test.tsx
new file mode 100644
index 00000000000..840db5199ea
--- /dev/null
+++ b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListTerm.test.tsx
@@ -0,0 +1,35 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DescriptionListTerm } from '../DescriptionListTerm';
+
+import styles from '@patternfly/react-styles/css/components/DescriptionList/description-list';
+
+test('Renders to match snapshot', () => {
+ const { asFragment } = render(test );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders default class ${styles.descriptionListTerm}`, () => {
+ render(test );
+ expect(screen.getByText('test').parentElement).toHaveClass(styles.descriptionListTerm, { exact: true });
+});
+
+test(`Renders default class ${styles.descriptionListText}`, () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveClass(styles.descriptionListText, { exact: true });
+});
+
+test('Renders custom className', () => {
+ render(test );
+ expect(screen.getByText('test').parentElement).toHaveClass('custom');
+});
+
+test('Renders icon', () => {
+ render(icon }>test);
+ expect(screen.getByText('icon').parentElement).toHaveClass(styles.descriptionListTermIcon);
+});
+
+test('Renders spread props', () => {
+ render(test );
+ expect(screen.getByText('test').parentElement).toHaveAttribute('id', 'id');
+});
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListTermHelpText.test.tsx b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListTermHelpText.test.tsx
new file mode 100644
index 00000000000..1bd9779d379
--- /dev/null
+++ b/packages/react-core/src/components/DescriptionList/__tests__/DescriptionListTermHelpText.test.tsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { DescriptionListTermHelpText } from '../DescriptionListTermHelpText';
+
+import styles from '@patternfly/react-styles/css/components/DescriptionList/description-list';
+
+test('Renders to match snapshot', () => {
+ const { asFragment } = render(test );
+ expect(asFragment()).toMatchSnapshot();
+});
+
+test(`Renders default class ${styles.descriptionListTerm}`, () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveClass(styles.descriptionListTerm, { exact: true });
+});
+
+test('Renders custom className', () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveClass('custom');
+});
+
+test('Renders spread props', () => {
+ render(test );
+ expect(screen.getByText('test')).toHaveAttribute('id', 'id');
+});
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionList.test.tsx.snap b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionList.test.tsx.snap
index b9bde9f6974..e59055aa1af 100644
--- a/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionList.test.tsx.snap
+++ b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionList.test.tsx.snap
@@ -1,162 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Description List 1 col on all breakpoints 1`] = `
-
-
-`;
-
-exports[`Description List 2 col on all breakpoints 1`] = `
-
-
-`;
-
-exports[`Description List 3 col on all breakpoints 1`] = `
-
-
-`;
-
-exports[`Description List Auto Column Widths Description List 1`] = `
-
-
-`;
-
-exports[`Description List Auto fit Description List 1`] = `
-
-
-`;
-
-exports[`Description List Auto fit with responsive grid Description List 1`] = `
-
-
-`;
-
-exports[`Description List Compact Description List 1`] = `
-
-
-`;
-
-exports[`Description List Compact Horizontal Description List 1`] = `
-
-
-`;
-
-exports[`Description List Description 1`] = `
-
-
-
- test
-
-
-
-`;
-
-exports[`Description List Fluid Horizontal Description List 1`] = `
-
-
-`;
-
-exports[`Description List Group 1`] = `
-
-
- test
-
-
-`;
-
-exports[`Description List Horizontal Description List 1`] = `
-
-
-`;
-
-exports[`Description List Inline Grid Description List 1`] = `
-
-
-`;
-
-exports[`Description List Term default 1`] = `
-
-
-
- test
-
-
-
-`;
-
-exports[`Description List Term helper text 1`] = `
-
-
-
- test
-
-
-
-`;
-
-exports[`Description List alignment breakpoints 1`] = `
-
-
-`;
-
-exports[`Description List default 1`] = `
+exports[`Renders to match snapshot 1`] = `
+
+
+ test
+
+
+
+`;
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListGroup.test.tsx.snap b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListGroup.test.tsx.snap
new file mode 100644
index 00000000000..73b0656b755
--- /dev/null
+++ b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListGroup.test.tsx.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+ test
+
+
+`;
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListHelpTextButton.test.tsx.snap b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListHelpTextButton.test.tsx.snap
new file mode 100644
index 00000000000..1d85b2b7303
--- /dev/null
+++ b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListHelpTextButton.test.tsx.snap
@@ -0,0 +1,14 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+ test
+
+
+`;
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListTerm.test.tsx.snap b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListTerm.test.tsx.snap
new file mode 100644
index 00000000000..a99897481de
--- /dev/null
+++ b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListTerm.test.tsx.snap
@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+
+ test
+
+
+
+`;
diff --git a/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListTermHelpText.test.tsx.snap b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListTermHelpText.test.tsx.snap
new file mode 100644
index 00000000000..883c9a40ad7
--- /dev/null
+++ b/packages/react-core/src/components/DescriptionList/__tests__/__snapshots__/DescriptionListTermHelpText.test.tsx.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders to match snapshot 1`] = `
+
+
+ test
+
+
+`;
From e112034cf060e8917e5ba47079af4850a4f12d1a Mon Sep 17 00:00:00 2001
From: patternfly-build
Date: Thu, 16 Nov 2023 18:20:21 +0000
Subject: [PATCH 37/41] chore(release): releasing packages [ci skip]
- @patternfly/react-code-editor@5.2.0-prerelease.30
- @patternfly/react-core@5.2.0-prerelease.30
- @patternfly/react-docs@6.2.0-prerelease.30
- demo-app-ts@5.1.1-prerelease.53
- @patternfly/react-table@5.2.0-prerelease.30
---
packages/react-code-editor/CHANGELOG.md | 4 ++++
packages/react-code-editor/package.json | 4 ++--
packages/react-core/CHANGELOG.md | 6 ++++++
packages/react-core/package.json | 2 +-
packages/react-docs/CHANGELOG.md | 4 ++++
packages/react-docs/package.json | 8 ++++----
packages/react-integration/demo-app-ts/CHANGELOG.md | 4 ++++
packages/react-integration/demo-app-ts/package.json | 4 ++--
packages/react-table/CHANGELOG.md | 4 ++++
packages/react-table/package.json | 4 ++--
10 files changed, 33 insertions(+), 11 deletions(-)
diff --git a/packages/react-code-editor/CHANGELOG.md b/packages/react-code-editor/CHANGELOG.md
index 15b5aee77c6..7f7e1570a0b 100644
--- a/packages/react-code-editor/CHANGELOG.md
+++ b/packages/react-code-editor/CHANGELOG.md
@@ -3,6 +3,10 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+# [5.2.0-prerelease.30](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-code-editor@5.2.0-prerelease.29...@patternfly/react-code-editor@5.2.0-prerelease.30) (2023-11-16)
+
+**Note:** Version bump only for package @patternfly/react-code-editor
+
# [5.2.0-prerelease.29](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-code-editor@5.2.0-prerelease.28...@patternfly/react-code-editor@5.2.0-prerelease.29) (2023-11-14)
**Note:** Version bump only for package @patternfly/react-code-editor
diff --git a/packages/react-code-editor/package.json b/packages/react-code-editor/package.json
index 47a676270a9..05e5c392516 100644
--- a/packages/react-code-editor/package.json
+++ b/packages/react-code-editor/package.json
@@ -1,6 +1,6 @@
{
"name": "@patternfly/react-code-editor",
- "version": "5.2.0-prerelease.29",
+ "version": "5.2.0-prerelease.30",
"description": "This package provides a PatternFly wrapper for the Monaco code editor\n",
"main": "dist/js/index.js",
"module": "dist/esm/index.js",
@@ -29,7 +29,7 @@
"clean": "rimraf dist"
},
"dependencies": {
- "@patternfly/react-core": "^5.2.0-prerelease.29",
+ "@patternfly/react-core": "^5.2.0-prerelease.30",
"@patternfly/react-icons": "^5.2.0-prerelease.8",
"@patternfly/react-styles": "^5.2.0-prerelease.5",
"react-dropzone": "14.2.3",
diff --git a/packages/react-core/CHANGELOG.md b/packages/react-core/CHANGELOG.md
index 8acff946206..d3487b02425 100644
--- a/packages/react-core/CHANGELOG.md
+++ b/packages/react-core/CHANGELOG.md
@@ -3,6 +3,12 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+# [5.2.0-prerelease.30](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@5.2.0-prerelease.29...@patternfly/react-core@5.2.0-prerelease.30) (2023-11-16)
+
+### Bug Fixes
+
+- **Chip:** update tooltip vis when chip updates ([#9819](https://github.com/patternfly/patternfly-react/issues/9819)) ([18c140a](https://github.com/patternfly/patternfly-react/commit/18c140a2adcc1833e4b095755aa7495d1d88a177))
+
# [5.2.0-prerelease.29](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@5.2.0-prerelease.28...@patternfly/react-core@5.2.0-prerelease.29) (2023-11-14)
**Note:** Version bump only for package @patternfly/react-core
diff --git a/packages/react-core/package.json b/packages/react-core/package.json
index a33ed197c0d..656c35f49f8 100644
--- a/packages/react-core/package.json
+++ b/packages/react-core/package.json
@@ -1,6 +1,6 @@
{
"name": "@patternfly/react-core",
- "version": "5.2.0-prerelease.29",
+ "version": "5.2.0-prerelease.30",
"description": "This library provides a set of common React components for use with the PatternFly reference implementation.",
"main": "dist/js/index.js",
"module": "dist/esm/index.js",
diff --git a/packages/react-docs/CHANGELOG.md b/packages/react-docs/CHANGELOG.md
index e862937d90f..02076718c21 100644
--- a/packages/react-docs/CHANGELOG.md
+++ b/packages/react-docs/CHANGELOG.md
@@ -3,6 +3,10 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+# [6.2.0-prerelease.30](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-docs@6.2.0-prerelease.29...@patternfly/react-docs@6.2.0-prerelease.30) (2023-11-16)
+
+**Note:** Version bump only for package @patternfly/react-docs
+
# [6.2.0-prerelease.29](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-docs@6.2.0-prerelease.28...@patternfly/react-docs@6.2.0-prerelease.29) (2023-11-14)
**Note:** Version bump only for package @patternfly/react-docs
diff --git a/packages/react-docs/package.json b/packages/react-docs/package.json
index 04fb13cc778..afa7fa0572a 100644
--- a/packages/react-docs/package.json
+++ b/packages/react-docs/package.json
@@ -1,7 +1,7 @@
{
"name": "@patternfly/react-docs",
"description": "PatternFly React Docs",
- "version": "6.2.0-prerelease.29",
+ "version": "6.2.0-prerelease.30",
"publishConfig": {
"access": "public"
},
@@ -24,11 +24,11 @@
"dependencies": {
"@patternfly/patternfly": "5.2.0-prerelease.5",
"@patternfly/react-charts": "^7.2.0-prerelease.7",
- "@patternfly/react-code-editor": "^5.2.0-prerelease.29",
- "@patternfly/react-core": "^5.2.0-prerelease.29",
+ "@patternfly/react-code-editor": "^5.2.0-prerelease.30",
+ "@patternfly/react-core": "^5.2.0-prerelease.30",
"@patternfly/react-icons": "^5.2.0-prerelease.8",
"@patternfly/react-styles": "^5.2.0-prerelease.5",
- "@patternfly/react-table": "^5.2.0-prerelease.29",
+ "@patternfly/react-table": "^5.2.0-prerelease.30",
"@patternfly/react-tokens": "^5.2.0-prerelease.6"
},
"devDependencies": {
diff --git a/packages/react-integration/demo-app-ts/CHANGELOG.md b/packages/react-integration/demo-app-ts/CHANGELOG.md
index 0d4bea065fc..ca03664d28d 100644
--- a/packages/react-integration/demo-app-ts/CHANGELOG.md
+++ b/packages/react-integration/demo-app-ts/CHANGELOG.md
@@ -3,6 +3,10 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+## [5.1.1-prerelease.53](https://github.com/patternfly/patternfly-react/compare/demo-app-ts@5.1.1-prerelease.52...demo-app-ts@5.1.1-prerelease.53) (2023-11-16)
+
+**Note:** Version bump only for package demo-app-ts
+
## [5.1.1-prerelease.52](https://github.com/patternfly/patternfly-react/compare/demo-app-ts@5.1.1-prerelease.51...demo-app-ts@5.1.1-prerelease.52) (2023-11-14)
**Note:** Version bump only for package demo-app-ts
diff --git a/packages/react-integration/demo-app-ts/package.json b/packages/react-integration/demo-app-ts/package.json
index d3e88bbcf57..c70e8de4e6d 100644
--- a/packages/react-integration/demo-app-ts/package.json
+++ b/packages/react-integration/demo-app-ts/package.json
@@ -1,7 +1,7 @@
{
"name": "demo-app-ts",
"private": true,
- "version": "5.1.1-prerelease.52",
+ "version": "5.1.1-prerelease.53",
"scripts": {
"build:demo-app": "webpack --mode production",
"start:demo-app": "webpack-dev-server",
@@ -9,7 +9,7 @@
"serve:demo-app": "node scripts/serve"
},
"dependencies": {
- "@patternfly/react-core": "^5.2.0-prerelease.29",
+ "@patternfly/react-core": "^5.2.0-prerelease.30",
"react": "^18",
"react-dom": "^18",
"react-router": "^5.3.3",
diff --git a/packages/react-table/CHANGELOG.md b/packages/react-table/CHANGELOG.md
index cab8f6c5d8c..68e0a0eb7a6 100644
--- a/packages/react-table/CHANGELOG.md
+++ b/packages/react-table/CHANGELOG.md
@@ -3,6 +3,10 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+# [5.2.0-prerelease.30](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-table@5.2.0-prerelease.29...@patternfly/react-table@5.2.0-prerelease.30) (2023-11-16)
+
+**Note:** Version bump only for package @patternfly/react-table
+
# [5.2.0-prerelease.29](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-table@5.2.0-prerelease.28...@patternfly/react-table@5.2.0-prerelease.29) (2023-11-14)
**Note:** Version bump only for package @patternfly/react-table
diff --git a/packages/react-table/package.json b/packages/react-table/package.json
index ddf86fcc7d3..544095b3af8 100644
--- a/packages/react-table/package.json
+++ b/packages/react-table/package.json
@@ -1,6 +1,6 @@
{
"name": "@patternfly/react-table",
- "version": "5.2.0-prerelease.29",
+ "version": "5.2.0-prerelease.30",
"description": "This library provides a set of React table components for use with the PatternFly 4",
"main": "dist/js/index.js",
"module": "dist/esm/index.js",
@@ -39,7 +39,7 @@
"subpaths": "node ../../scripts/exportSubpaths.js --config subpaths.config.json"
},
"dependencies": {
- "@patternfly/react-core": "^5.2.0-prerelease.29",
+ "@patternfly/react-core": "^5.2.0-prerelease.30",
"@patternfly/react-icons": "^5.2.0-prerelease.8",
"@patternfly/react-styles": "^5.2.0-prerelease.5",
"@patternfly/react-tokens": "^5.2.0-prerelease.6",
From 7d2fd2678f993459f67a04d173a8d16c16ef50a3 Mon Sep 17 00:00:00 2001
From: Eric Olkowski <70952936+thatblindgeye@users.noreply.github.com>
Date: Thu, 16 Nov 2023 17:33:56 -0500
Subject: [PATCH 38/41] chore(TreeView): updated tests (#9773)
* chore(TreeView): updated tests
* Added tests for TreeViewListItem
* Added tests for TreeViewRoot and TreeView
* Updated snapshots and queries
---
.../components/TreeView/TreeViewListItem.tsx | 2 +-
.../TreeView/__tests__/TreeView.test.tsx | 516 +--
.../TreeView/__tests__/TreeViewList.test.tsx | 52 +
.../__tests__/TreeViewListItem.test.tsx | 708 ++++
.../TreeView/__tests__/TreeViewRoot.test.tsx | 87 +
.../__tests__/TreeViewSearch.test.tsx | 93 +
.../__snapshots__/TreeView.test.tsx.snap | 3510 +----------------
.../__snapshots__/TreeViewList.test.tsx.snap | 29 +
.../TreeViewListItem.test.tsx.snap | 83 +
.../__snapshots__/TreeViewRoot.test.tsx.snap | 16 +
.../TreeViewSearch.test.tsx.snap | 38 +
11 files changed, 1505 insertions(+), 3629 deletions(-)
create mode 100644 packages/react-core/src/components/TreeView/__tests__/TreeViewList.test.tsx
create mode 100644 packages/react-core/src/components/TreeView/__tests__/TreeViewListItem.test.tsx
create mode 100644 packages/react-core/src/components/TreeView/__tests__/TreeViewRoot.test.tsx
create mode 100644 packages/react-core/src/components/TreeView/__tests__/TreeViewSearch.test.tsx
create mode 100644 packages/react-core/src/components/TreeView/__tests__/__snapshots__/TreeViewList.test.tsx.snap
create mode 100644 packages/react-core/src/components/TreeView/__tests__/__snapshots__/TreeViewListItem.test.tsx.snap
create mode 100644 packages/react-core/src/components/TreeView/__tests__/__snapshots__/TreeViewRoot.test.tsx.snap
create mode 100644 packages/react-core/src/components/TreeView/__tests__/__snapshots__/TreeViewSearch.test.tsx.snap
diff --git a/packages/react-core/src/components/TreeView/TreeViewListItem.tsx b/packages/react-core/src/components/TreeView/TreeViewListItem.tsx
index fcbf541bf61..53c3775fe8f 100644
--- a/packages/react-core/src/components/TreeView/TreeViewListItem.tsx
+++ b/packages/react-core/src/components/TreeView/TreeViewListItem.tsx
@@ -198,7 +198,7 @@ const TreeViewListItemBase: React.FunctionComponent = ({
diff --git a/packages/react-core/src/components/TreeView/__tests__/TreeView.test.tsx b/packages/react-core/src/components/TreeView/__tests__/TreeView.test.tsx
index 07f197ab765..cfdb202370f 100644
--- a/packages/react-core/src/components/TreeView/__tests__/TreeView.test.tsx
+++ b/packages/react-core/src/components/TreeView/__tests__/TreeView.test.tsx
@@ -1,242 +1,316 @@
import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
import { TreeView } from '../TreeView';
-import { Button } from '@patternfly/react-core';
-import FolderIcon from '@patternfly/react-icons/dist/esm/icons/folder-icon';
-import FolderOpenIcon from '@patternfly/react-icons/dist/esm/icons/folder-open-icon';
-import { TreeViewSearch } from '../TreeViewSearch';
-
-const options = [
- {
- name: 'ApplicationLauncher',
- id: 'AppLaunch',
- children: [
- {
- name: 'Application 1',
- id: 'App1',
- children: [
- { name: 'Settings', id: 'App1Settings' },
- { name: 'Current', id: 'App1Current' }
- ]
- },
- {
- name: 'Application 2',
- id: 'App2',
- children: [
- { name: 'Settings', id: 'App2Settings' },
- {
- name: 'Loader',
- id: 'App2Loader',
- children: [
- { name: 'Loading App 1', id: 'LoadApp1' },
- { name: 'Loading App 2', id: 'LoadApp2' },
- { name: 'Loading App 3', id: 'LoadApp3' }
- ]
- }
- ]
- }
- ],
- defaultExpanded: true
- },
- {
- name: 'Cost Management',
- id: 'Cost',
- children: [
- {
- name: 'Application 3',
- id: 'App3',
- children: [
- { name: 'Settings', id: 'App3Settings' },
- { name: 'Current', id: 'App3Current' }
- ]
- }
- ]
- },
- {
- name: 'Sources',
- id: 'Sources',
- children: [{ name: 'Application 4', id: 'App4', children: [{ name: 'Settings', id: 'App4Settings' }] }]
- },
- {
- name: 'Really really really long folder name that overflows the container it is in',
- id: 'Long',
- children: [{ name: 'Application 5', id: 'App5' }]
- }
-];
-
-const flagOptions = [
- {
- name: 'ApplicationLauncher',
- id: 'AppLaunch',
- hasCheckbox: true,
- icon:
-
- ),
- children: [
- {
- name: 'Application 3',
- id: 'App3',
- children: [
- { name: 'Settings', id: 'App3Settings' },
- { name: 'Current', id: 'App3Current' }
- ]
- }
- ]
- },
- {
- name: 'Sources',
- id: 'Sources',
- children: [{ name: 'Application 4', id: 'App4', children: [{ name: 'Settings', id: 'App4Settings' }] }]
- },
- {
- name: 'Really really really long folder name that overflows the container it is in',
- id: 'Long',
- children: [{ name: 'Application 5', id: 'App5' }]
- }
-];
-
-const active = [
- {
- name: 'Application 1',
- id: 'App1',
- children: [
- { name: 'Settings', id: 'App1Settings' },
- { name: 'Current', id: 'App1Current' }
- ]
- }
-];
-
-describe('tree view', () => {
- test('renders basic successfully', () => {
- const { asFragment } = render(
+
{`TreeViewList isNested: ${isNested}`}
+
{`TreeViewList toolbar: ${toolbar}`}
+
{children}
+
+
{`TreeViewListItem action: ${action}`}
+
{activeItems && activeItems[0].name}
+
{`TreeViewListItem badgeProps: ${badgeProps?.id}`}
+
{`TreeViewListItem checkProps: ${checkProps?.checked}`}
+
{`TreeViewListItem customBadgeContent: ${customBadgeContent}`}
+
{`TreeViewListItem defaultExpanded: ${defaultExpanded}`}
+
{`TreeViewListItem expandedIcon: ${expandedIcon}`}
+
{`TreeViewListItem hasBadge: ${hasBadge}`}
+
{`TreeViewListItem hasCheckbox: ${hasCheckbox}`}
+
{`TreeViewListItem icon: ${icon}`}
+
{`TreeViewListItem id: ${id}`}
+
{`TreeViewListItem isCompact: ${isCompact}`}
+
{`TreeViewListItem isExpanded: ${isExpanded}`}
+
{`TreeViewListItem isSelectable: ${isSelectable}`}
+
{`TreeViewListItem itemData: ${itemData.name}`}
+
{`TreeViewListItem name: ${name}`}
+
{`TreeViewListItem parentItem: ${parentItem?.name}`}
+
{`TreeViewListItem title: ${title}`}
+
{`TreeViewListItem useMemo: ${useMemo}`}
+
compareItems clicker
+
onCheck clicker
+
onSelect clicker
+
onExpand clicker
+
onCollapse clicker
+
{children}
+
+
{`TreeViewRoot hasCheckboxes: ${hasCheckboxes}`}
+
{`TreeViewRoot hasGuides: ${hasGuides}`}
+
{`TreeViewRoot hasSelectableNodes: ${hasSelectableNodes}`}
+
{`TreeViewRoot variant: ${variant}`}
+
{`TreeViewRoot className: ${className}`}
+
{children}
+
test