@patternfly/react-core 4.199.1 → 4.199.4

package/src/components/ApplicationLauncher/__tests__/Generated/ApplicationLauncherSeparator.test.tsx

@@ -1,13 +1,16 @@
-/**
- * This test was generated
- */
-import * as React from 'react';
-import { shallow } from 'enzyme';
+import React from 'react';
+import { render } from '@testing-library/react';
+
 import { ApplicationLauncherSeparator } from '../../ApplicationLauncherSeparator';
-// any missing imports can usually be resolved by adding them here
-import {} from '../..';
+import { DropdownArrowContext } from '../../../Dropdown/dropdownConstants';
 
-it('ApplicationLauncherSeparator should match snapshot (auto-generated)', () => {
-  const view = shallow(<ApplicationLauncherSeparator />);
-  expect(view).toMatchSnapshot();
+describe('ApplicationLauncherSeparator', () => {
+  it('should match snapshot', () => {
+    const view = render(
+      <DropdownArrowContext.Provider value={{ sendRef: jest.fn(), keyHandler: undefined }}>
+        <ApplicationLauncherSeparator />
+      </DropdownArrowContext.Provider>
+    );
+    expect(view.container).toMatchSnapshot();
+  });
 });

package/src/components/ApplicationLauncher/__tests__/Generated/__snapshots__/ApplicationLauncherSeparator.test.tsx.snap

@@ -1,3 +1,14 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`ApplicationLauncherSeparator should match snapshot (auto-generated) 1`] = `<DropdownSeparator />`;
+exports[`ApplicationLauncherSeparator should match snapshot 1`] = `
+<div>
+  <li
+    role="separator"
+  >
+    <div
+      class="pf-c-divider"
+      role="separator"
+    />
+  </li>
+</div>
+`;

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

@@ -1,132 +1,141 @@
-import { Button, ButtonVariant } from '../Button';
 import React from 'react';
-import { render } from '@testing-library/react';
-import { mount } from 'enzyme';
+
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+
 import CartArrowDownIcon from '@patternfly/react-icons/dist/esm/icons/cart-arrow-down-icon';
+import { Button, ButtonVariant } from '../Button';
+
+describe('Button', () => {
+  Object.values(ButtonVariant).forEach(variant => {
+    test(`${variant} button`, () => {
+      const view = render(
+        <Button variant={variant} aria-label={variant}>
+          {variant} Button
+        </Button>
+      );
+      expect(view.container).toMatchSnapshot();
+    });
+  });
+
+  test('it adds an aria-label to plain buttons', () => {
+    const label = 'aria-label test';
+    render(<Button aria-label={label} />);
 
-Object.values(ButtonVariant).forEach(variant => {
-  test(`${variant} button`, () => {
+    expect(screen.getByLabelText(label)).toBeTruthy();
+  });
+
+  test('link with icon', () => {
     const view = render(
-      <Button variant={variant} aria-label={variant}>
-        {variant} Button
+      <Button variant={ButtonVariant.link} icon={<CartArrowDownIcon />}>
+        Block Button
       </Button>
     );
     expect(view.container).toMatchSnapshot();
   });
-});
 
-test('it adds an aria-label to plain buttons', () => {
-  const label = 'aria-label test';
-  const view = mount(<Button aria-label={label} />);
-  expect(view.find('button').props()['aria-label']).toBe(label);
-});
+  test('isBlock', () => {
+    const view = render(<Button isBlock>Block Button</Button>);
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('link with icon', () => {
-  const view = render(
-    <Button variant={ButtonVariant.link} icon={<CartArrowDownIcon />}>
-      Block Button
-    </Button>
-  );
-  expect(view.container).toMatchSnapshot();
-});
+  test('isDisabled', () => {
+    const view = render(<Button isDisabled>Disabled Button</Button>);
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isBlock', () => {
-  const view = render(<Button isBlock>Block Button</Button>);
-  expect(view.container).toMatchSnapshot();
-});
+  test('isDanger secondary', () => {
+    const view = render(
+      <Button variant="secondary" isDanger>
+        Disabled Button
+      </Button>
+    );
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isDisabled', () => {
-  const view = render(<Button isDisabled>Disabled Button</Button>);
-  expect(view.container).toMatchSnapshot();
-});
+  test('isDanger link', () => {
+    const view = render(
+      <Button variant="link" isDanger>
+        Disabled Button
+      </Button>
+    );
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isDanger secondary', () => {
-  const view = render(
-    <Button variant="secondary" isDanger>
-      Disabled Button
-    </Button>
-  );
-  expect(view.container).toMatchSnapshot();
-});
+  test('isAriaDisabled button', () => {
+    const view = render(<Button isAriaDisabled>Disabled yet focusable button</Button>);
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isDanger link', () => {
-  const view = render(
-    <Button variant="link" isDanger>
-      Disabled Button
-    </Button>
-  );
-  expect(view.container).toMatchSnapshot();
-});
+  test('isAriaDisabled link button', () => {
+    const view = render(
+      <Button isAriaDisabled component="a">
+        Disabled yet focusable button
+      </Button>
+    );
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isAriaDisabled button', () => {
-  const view = render(<Button isAriaDisabled>Disabled yet focusable button</Button>);
-  expect(view.container).toMatchSnapshot();
-});
+  test('isInline', () => {
+    const view = render(
+      <Button variant={ButtonVariant.link} isInline>
+        Hovered Button
+      </Button>
+    );
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isAriaDisabled link button', () => {
-  const view = render(
-    <Button isAriaDisabled component="a">
-      Disabled yet focusable button
-    </Button>
-  );
-  expect(view.container).toMatchSnapshot();
-});
+  test('isSmall', () => {
+    const view = render(<Button isSmall>Small Button</Button>);
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isInline', () => {
-  const view = render(
-    <Button variant={ButtonVariant.link} isInline>
-      Hovered Button
-    </Button>
-  );
-  expect(view.container).toMatchSnapshot();
-});
+  test('isLarge', () => {
+    const view = render(<Button isLarge>Large Button</Button>);
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isSmall', () => {
-  const view = render(<Button isSmall>Small Button</Button>);
-  expect(view.container).toMatchSnapshot();
-});
+  test('isLoading', () => {
+    const view = render(
+      <Button isLoading spinnerAriaValueText="Loading">
+        Loading Button
+      </Button>
+    );
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('isLarge', () => {
-  const view = render(<Button isLarge>Large Button</Button>);
-  expect(view.container).toMatchSnapshot();
-});
+  test('allows passing in a string as the component', () => {
+    const component = 'a';
+    render(<Button component={component}>anchor button</Button>);
 
-test('isLoading', () => {
-  const view = render(
-    <Button isLoading spinnerAriaValueText="Loading">
-      Loading Button
-    </Button>
-  );
-  expect(view.container).toMatchSnapshot();
-});
+    expect(screen.getByText('anchor button')).toBeInTheDocument();
+  });
 
-test('allows passing in a string as the component', () => {
-  const component = 'a';
-  const view = mount(<Button component={component} />);
-  expect(view.find(component).type()).toBe(component);
-});
+  test('allows passing in a React Component as the component', () => {
+    const Component = () => <div>im a div</div>;
+    render(<Button component={Component} />);
 
-test('allows passing in a React Component as the component', () => {
-  const Component = () => <div>im a div</div>;
-  const view = mount(<Button component={Component} />);
-  expect(view.find(Component).type()).toBe(Component);
-});
+    expect(screen.getByText('im a div')).toBeInTheDocument();
+  });
 
-test('aria-disabled is set to true and tabIndex to -1 if component is not a button and is disabled', () => {
-  const view = render(
-    <Button component="a" isDisabled>
-      Disabled Anchor Button
-    </Button>
-  );
-  expect(view.container).toMatchSnapshot();
-});
+  test('aria-disabled is set to true and tabIndex to -1 if component is not a button and is disabled', () => {
+    const view = render(
+      <Button component="a" isDisabled>
+        Disabled Anchor Button
+      </Button>
+    );
+    expect(view.container).toMatchSnapshot();
+  });
 
-test('setting tab index through props', () => {
-  const view = mount(<Button tabIndex={0}>TabIndex 0 Button</Button>);
-  expect(view.find('button').props().tabIndex).toBe(0);
-});
+  test('setting tab index through props', () => {
+    render(<Button tabIndex={0}>TabIndex 0 Button</Button>);
+    expect(screen.getByRole('button').getAttribute('tabindex')).toEqual('0');
+  });
 
-test('isLoading icon only', () => {
-  const view = render(<Button variant="plain" isLoading aria-label="Upload" spinnerAriaValueText="Loading" icon={<div>ICON</div>} />)
-  expect(view.container).toMatchSnapshot();
-})
+  test('isLoading icon only', () => {
+    const view = render(
+      <Button variant="plain" isLoading aria-label="Upload" spinnerAriaValueText="Loading" icon={<div>ICON</div>} />
+    );
+    expect(view.container).toMatchSnapshot();
+  });
+});

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

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`aria-disabled is set to true and tabIndex to -1 if component is not a button and is disabled 1`] = `
+exports[`Button aria-disabled is set to true and tabIndex to -1 if component is not a button and is disabled 1`] = `
 <div>
   <a
     aria-disabled="true"
@@ -15,7 +15,7 @@ exports[`aria-disabled is set to true and tabIndex to -1 if component is not a b
 </div>
 `;
 
-exports[`control button 1`] = `
+exports[`Button control button 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -32,7 +32,7 @@ exports[`control button 1`] = `
 </div>
 `;
 
-exports[`danger button 1`] = `
+exports[`Button danger button 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -49,7 +49,7 @@ exports[`danger button 1`] = `
 </div>
 `;
 
-exports[`isAriaDisabled button 1`] = `
+exports[`Button isAriaDisabled button 1`] = `
 <div>
   <button
     aria-disabled="true"
@@ -64,7 +64,7 @@ exports[`isAriaDisabled button 1`] = `
 </div>
 `;
 
-exports[`isAriaDisabled link button 1`] = `
+exports[`Button isAriaDisabled link button 1`] = `
 <div>
   <a
     aria-disabled="true"
@@ -78,7 +78,7 @@ exports[`isAriaDisabled link button 1`] = `
 </div>
 `;
 
-exports[`isBlock 1`] = `
+exports[`Button isBlock 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -93,7 +93,7 @@ exports[`isBlock 1`] = `
 </div>
 `;
 
-exports[`isDanger link 1`] = `
+exports[`Button isDanger link 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -108,7 +108,7 @@ exports[`isDanger link 1`] = `
 </div>
 `;
 
-exports[`isDanger secondary 1`] = `
+exports[`Button isDanger secondary 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -123,7 +123,7 @@ exports[`isDanger secondary 1`] = `
 </div>
 `;
 
-exports[`isDisabled 1`] = `
+exports[`Button isDisabled 1`] = `
 <div>
   <button
     aria-disabled="true"
@@ -139,7 +139,7 @@ exports[`isDisabled 1`] = `
 </div>
 `;
 
-exports[`isInline 1`] = `
+exports[`Button isInline 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -154,7 +154,7 @@ exports[`isInline 1`] = `
 </div>
 `;
 
-exports[`isLarge 1`] = `
+exports[`Button isLarge 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -169,7 +169,7 @@ exports[`isLarge 1`] = `
 </div>
 `;
 
-exports[`isLoading 1`] = `
+exports[`Button isLoading 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -204,7 +204,7 @@ exports[`isLoading 1`] = `
 </div>
 `;
 
-exports[`isLoading icon only 1`] = `
+exports[`Button isLoading icon only 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -242,7 +242,7 @@ exports[`isLoading icon only 1`] = `
 </div>
 `;
 
-exports[`isSmall 1`] = `
+exports[`Button isSmall 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -257,7 +257,7 @@ exports[`isSmall 1`] = `
 </div>
 `;
 
-exports[`link button 1`] = `
+exports[`Button link button 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -274,7 +274,7 @@ exports[`link button 1`] = `
 </div>
 `;
 
-exports[`link with icon 1`] = `
+exports[`Button link with icon 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -306,7 +306,7 @@ exports[`link with icon 1`] = `
 </div>
 `;
 
-exports[`plain button 1`] = `
+exports[`Button plain button 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -323,7 +323,7 @@ exports[`plain button 1`] = `
 </div>
 `;
 
-exports[`primary button 1`] = `
+exports[`Button primary button 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -340,7 +340,7 @@ exports[`primary button 1`] = `
 </div>
 `;
 
-exports[`secondary button 1`] = `
+exports[`Button secondary button 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -357,7 +357,7 @@ exports[`secondary button 1`] = `
 </div>
 `;
 
-exports[`tertiary button 1`] = `
+exports[`Button tertiary button 1`] = `
 <div>
   <button
     aria-disabled="false"
@@ -374,7 +374,7 @@ exports[`tertiary button 1`] = `
 </div>
 `;
 
-exports[`warning button 1`] = `
+exports[`Button warning button 1`] = `
 <div>
   <button
     aria-disabled="false"