@patternfly/react-core 4.206.5 → 4.208.0

package/src/components/Progress/__tests__/__snapshots__/Progress.test.tsx.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Progress measure location inside 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-inside pf-m-lg pf-m-singleline"
     id="inside-progress"
@@ -34,11 +34,11 @@ exports[`Progress measure location inside 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress measure location inside and small should render large 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-inside pf-m-lg pf-m-singleline"
     id="large-progress"
@@ -71,11 +71,11 @@ exports[`Progress measure location inside and small should render large 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress measure location none 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="none-progress"
@@ -106,11 +106,11 @@ exports[`Progress measure location none 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress measure location outside 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-outside pf-m-singleline"
     id="outside-progress"
@@ -147,11 +147,11 @@ exports[`Progress measure location outside 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress measure location top 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="top-progress"
@@ -188,11 +188,11 @@ exports[`Progress measure location top 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress size lg 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-lg pf-m-singleline"
     id="lg-progress"
@@ -229,11 +229,11 @@ exports[`Progress size lg 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress size md 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="md-progress"
@@ -270,11 +270,11 @@ exports[`Progress size md 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress size sm 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-sm pf-m-singleline"
     id="sm-progress"
@@ -311,11 +311,11 @@ exports[`Progress size sm 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress variant danger 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-danger pf-m-singleline"
     id="danger-progress"
@@ -369,11 +369,11 @@ exports[`Progress variant danger 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress variant success 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-success pf-m-singleline"
     id="success-progress"
@@ -427,11 +427,11 @@ exports[`Progress variant success 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress variant warning 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-warning pf-m-singleline"
     id="warning-progress"
@@ -485,11 +485,11 @@ exports[`Progress variant warning 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Progress with aria-valuetext 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="progress-aria-valuetext"
@@ -527,11 +527,11 @@ exports[`Progress with aria-valuetext 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`Simple progress 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="progress-simple-example"
@@ -568,11 +568,11 @@ exports[`Simple progress 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`additional label 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="additional-label"
@@ -609,11 +609,11 @@ exports[`additional label 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`no value specified 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="no-value"
@@ -650,11 +650,11 @@ exports[`no value specified 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`value higher than maxValue 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="higher-max-value"
@@ -691,11 +691,11 @@ exports[`value higher than maxValue 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`value lower than minValue 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="lower-min-value"
@@ -732,11 +732,11 @@ exports[`value lower than minValue 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`value scaled between minValue and maxValue 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="scaled-range-value"
@@ -773,11 +773,11 @@ exports[`value scaled between minValue and maxValue 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`value scaled with maxValue 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="scaled-max-value"
@@ -814,11 +814,11 @@ exports[`value scaled with maxValue 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;
 
 exports[`value scaled with minValue 1`] = `
-<div>
+<DocumentFragment>
   <div
     class="pf-c-progress pf-m-singleline"
     id="scaled-min-value"
@@ -855,5 +855,5 @@ exports[`value scaled with minValue 1`] = `
       </div>
     </div>
   </div>
-</div>
+</DocumentFragment>
 `;

package/src/components/ProgressStepper/__tests__/ProgressStepper.test.tsx

@@ -6,70 +6,70 @@ import InProgressIcon from '@patternfly/react-icons/dist/esm/icons/in-progress-i
 
 describe('ProgressStepper', () => {
   test('renders content', () => {
-    const view = render(
+    const { asFragment } = render(
       <ProgressStepper>
         <ProgressStep>First</ProgressStep>
         <ProgressStep>Second</ProgressStep>
         <ProgressStep>Third</ProgressStep>
       </ProgressStepper>
     );
-    expect(view.container).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
 
   test('gets custom class and id', () => {
-    const view = render(
+    const { asFragment } = render(
       <ProgressStepper className="custom-class" id="test-id">
         <ProgressStep>First</ProgressStep>
         <ProgressStep>Second</ProgressStep>
         <ProgressStep>Third</ProgressStep>
       </ProgressStepper>
     );
-    expect(view.container).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
 
   test('renders vertically', () => {
-    const view = render(
+    const { asFragment } = render(
       <ProgressStepper isVertical>
         <ProgressStep>First</ProgressStep>
         <ProgressStep>Second</ProgressStep>
         <ProgressStep>Third</ProgressStep>
       </ProgressStepper>
     );
-    expect(view.container).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
 
   test('renders compact', () => {
-    const view = render(
+    const { asFragment } = render(
       <ProgressStepper isCompact>
         <ProgressStep>First</ProgressStep>
         <ProgressStep>Second</ProgressStep>
         <ProgressStep>Third</ProgressStep>
       </ProgressStepper>
     );
-    expect(view.container).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
 
   test('renders center aligned', () => {
-    const view = render(
+    const { asFragment } = render(
       <ProgressStepper isCenterAligned>
         <ProgressStep>First</ProgressStep>
         <ProgressStep>Second</ProgressStep>
         <ProgressStep>Third</ProgressStep>
       </ProgressStepper>
     );
-    expect(view.container).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
 });
 
 describe('ProgressStep', () => {
   test('renders content', () => {
-    const view = render(<ProgressStep>Title</ProgressStep>);
-    expect(view.container).toMatchSnapshot();
+    const { asFragment } = render(<ProgressStep>Title</ProgressStep>);
+    expect(asFragment()).toMatchSnapshot();
   });
 
   Object.values(['default', 'success', 'info', 'pending', 'warning', 'danger']).forEach(variant => {
     test(`renders ${variant} variant`, () => {
-      const view = render(
+      const { asFragment } = render(
         <ProgressStep
           variant={variant as 'default' | 'success' | 'info' | 'pending' | 'warning' | 'danger'}
           aria-label={variant}
@@ -77,36 +77,36 @@ describe('ProgressStep', () => {
           {variant} step
         </ProgressStep>
       );
-      expect(view.container).toMatchSnapshot();
+      expect(asFragment()).toMatchSnapshot();
     });
   });
 
   test('renders current', () => {
-    const view = render(<ProgressStep isCurrent>Title</ProgressStep>);
-    expect(view.container).toMatchSnapshot();
+    const { asFragment } = render(<ProgressStep isCurrent>Title</ProgressStep>);
+    expect(asFragment()).toMatchSnapshot();
   });
 
   test('renders help text styling', () => {
-    const view = render(<ProgressStep popoverRender={({ stepRef }) => (<div></div>)}>Title</ProgressStep>);
-    expect(view.container).toMatchSnapshot();
+    const { asFragment } = render(<ProgressStep popoverRender={() => <div></div>}>Title</ProgressStep>);
+    expect(asFragment()).toMatchSnapshot();
   });
 
   test('renders custom icon', () => {
-    const view = render(<ProgressStep icon={<InProgressIcon />}>Title</ProgressStep>);
-    expect(view.container).toMatchSnapshot();
+    const { asFragment } = render(<ProgressStep icon={<InProgressIcon />}>Title</ProgressStep>);
+    expect(asFragment()).toMatchSnapshot();
   });
 
   test('renders custom null icon - removing default from variant', () => {
-    const view = render(
+    const { asFragment } = render(
       <ProgressStep icon={null} variant="success">
         Title
       </ProgressStep>
     );
-    expect(view.container).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
 
   test('renders description', () => {
-    const view = render(<ProgressStep description="This is a description">Title</ProgressStep>);
-    expect(view.container).toMatchSnapshot();
+    const { asFragment } = render(<ProgressStep description="This is a description">Title</ProgressStep>);
+    expect(asFragment()).toMatchSnapshot();
   });
 });

package/src/components/ProgressStepper/__tests__/__snapshots__/ProgressStepper.test.tsx.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ProgressStep renders content 1`] = `
-<div>
+<DocumentFragment>
   <li
     class="pf-c-progress-stepper__step"
   >
@@ -22,11 +22,11 @@ exports[`ProgressStep renders content 1`] = `
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders current 1`] = `
-<div>
+<DocumentFragment>
   <li
     aria-current="step"
     class="pf-c-progress-stepper__step pf-m-current"
@@ -48,11 +48,11 @@ exports[`ProgressStep renders current 1`] = `
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders custom icon 1`] = `
-<div>
+<DocumentFragment>
   <li
     class="pf-c-progress-stepper__step"
   >
@@ -87,11 +87,11 @@ exports[`ProgressStep renders custom icon 1`] = `
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders custom null icon - removing default from variant 1`] = `
-<div>
+<DocumentFragment>
   <li
     class="pf-c-progress-stepper__step pf-m-success"
   >
@@ -112,11 +112,11 @@ exports[`ProgressStep renders custom null icon - removing default from variant 1
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders danger variant 1`] = `
-<div>
+<DocumentFragment>
   <li
     aria-label="danger"
     class="pf-c-progress-stepper__step pf-m-danger"
@@ -148,16 +148,15 @@ exports[`ProgressStep renders danger variant 1`] = `
       <div
         class="pf-c-progress-stepper__step-title"
       >
-        danger
-         step
+        danger step
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders default variant 1`] = `
-<div>
+<DocumentFragment>
   <li
     aria-label="default"
     class="pf-c-progress-stepper__step"
@@ -175,16 +174,15 @@ exports[`ProgressStep renders default variant 1`] = `
       <div
         class="pf-c-progress-stepper__step-title"
       >
-        default
-         step
+        default step
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders description 1`] = `
-<div>
+<DocumentFragment>
   <li
     class="pf-c-progress-stepper__step"
   >
@@ -210,11 +208,11 @@ exports[`ProgressStep renders description 1`] = `
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders help text styling 1`] = `
-<div>
+<DocumentFragment>
   <li
     class="pf-c-progress-stepper__step"
   >
@@ -239,11 +237,11 @@ exports[`ProgressStep renders help text styling 1`] = `
       </span>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders info variant 1`] = `
-<div>
+<DocumentFragment>
   <li
     aria-label="info"
     class="pf-c-progress-stepper__step pf-m-info"
@@ -275,16 +273,15 @@ exports[`ProgressStep renders info variant 1`] = `
       <div
         class="pf-c-progress-stepper__step-title"
       >
-        info
-         step
+        info step
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders pending variant 1`] = `
-<div>
+<DocumentFragment>
   <li
     aria-label="pending"
     class="pf-c-progress-stepper__step pf-m-pending"
@@ -302,16 +299,15 @@ exports[`ProgressStep renders pending variant 1`] = `
       <div
         class="pf-c-progress-stepper__step-title"
       >
-        pending
-         step
+        pending step
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders success variant 1`] = `
-<div>
+<DocumentFragment>
   <li
     aria-label="success"
     class="pf-c-progress-stepper__step pf-m-success"
@@ -343,16 +339,15 @@ exports[`ProgressStep renders success variant 1`] = `
       <div
         class="pf-c-progress-stepper__step-title"
       >
-        success
-         step
+        success step
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStep renders warning variant 1`] = `
-<div>
+<DocumentFragment>
   <li
     aria-label="warning"
     class="pf-c-progress-stepper__step pf-m-warning"
@@ -384,16 +379,15 @@ exports[`ProgressStep renders warning variant 1`] = `
       <div
         class="pf-c-progress-stepper__step-title"
       >
-        warning
-         step
+        warning step
       </div>
     </div>
   </li>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStepper gets custom class and id 1`] = `
-<div>
+<DocumentFragment>
   <ol
     class="pf-c-progress-stepper custom-class"
     id="test-id"
@@ -459,11 +453,11 @@ exports[`ProgressStepper gets custom class and id 1`] = `
       </div>
     </li>
   </ol>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStepper renders center aligned 1`] = `
-<div>
+<DocumentFragment>
   <ol
     class="pf-c-progress-stepper pf-m-center"
   >
@@ -528,11 +522,11 @@ exports[`ProgressStepper renders center aligned 1`] = `
       </div>
     </li>
   </ol>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStepper renders compact 1`] = `
-<div>
+<DocumentFragment>
   <ol
     class="pf-c-progress-stepper pf-m-compact"
   >
@@ -597,11 +591,11 @@ exports[`ProgressStepper renders compact 1`] = `
       </div>
     </li>
   </ol>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStepper renders content 1`] = `
-<div>
+<DocumentFragment>
   <ol
     class="pf-c-progress-stepper"
   >
@@ -666,11 +660,11 @@ exports[`ProgressStepper renders content 1`] = `
       </div>
     </li>
   </ol>
-</div>
+</DocumentFragment>
 `;
 
 exports[`ProgressStepper renders vertically 1`] = `
-<div>
+<DocumentFragment>
   <ol
     class="pf-c-progress-stepper pf-m-vertical"
   >
@@ -735,5 +729,5 @@ exports[`ProgressStepper renders vertically 1`] = `
       </div>
     </li>
   </ol>
-</div>
+</DocumentFragment>
 `;