test: update tests with the last version of jest/testing-library

test/Accordion.test.tsx

@@ -1,8 +1,8 @@
-import React from 'react';
+import '@testing-library/jest-dom';
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import { Accordion, AccordionHeader } from '../src';
+import React from 'react';
 import { AccordionItem } from 'reactstrap';
+import { Accordion, AccordionHeader } from '../src';
 
 describe('Accordion component', () => {
   it('should work as container for children elements', () => {

test/BottomNavItem.test.tsx

@@ -1,19 +1,18 @@
+import '@testing-library/jest-dom';
+import { render, screen } from '@testing-library/react';
 import React from 'react';
-import { screen, render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-
 import { BottomNavItem, preloadIcons } from '../src';
 
 // Icons are now async, so preload them to make it behave in an sync way
 beforeAll(() => preloadIcons(['it-comment']));
 
 // Test for breaking changes
-test('Should support old link props as @deprecated', () => {
-  const { getByRole } = render(<BottomNavItem link={'/my-url'} />);
+test('Should support old url props as @deprecated', () => {
+  const { getByRole } = render(<BottomNavItem url={'/my-url'} />);
   expect(getByRole('link')).toHaveAttribute('href', '/my-url');
 });
 
 test('should have a testId for resilient UI changes', () => {
-  render(<BottomNavItem link={'/my-url'} testId={'bottom-nav-test-id'} />);
+  render(<BottomNavItem url={'/my-url'} testId={'bottom-nav-test-id'} />);
   expect(screen.getByTestId('bottom-nav-test-id')).toBeTruthy();
 });

test/Breadcrumb.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 import { Breadcrumb } from '../src';
 
 describe('Breadcrumb component', () => {

test/Collapse.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 import { Collapse } from '../src';
 
 describe('Collapse component', () => {

test/Dimmer.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { Dimmer } from '../src';
 

test/DimmerButtons.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { DimmerButtons } from '../src';
 

test/Header.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { Header } from '../src';
 

test/Hero.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 import { Hero, HeroBackground, HeroButton, HeroTitle } from '../src';
 
 describe('Hero component', () => {

test/Icon.test.tsx

@@ -1,10 +1,10 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, waitFor, within } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
-import { clearIconCache, Icon, preloadIcons, icons } from '../src';
 import { readFile } from 'fs/promises';
 import { join } from 'path';
+import { Icon, clearIconCache, icons, preloadIcons } from '../src';
 
 async function getExceptionList() {
   const content = await readFile(join(__dirname, './', 'icons-with-no-title.txt'), 'utf8');

test/Input.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { act, fireEvent, render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { Input, preloadIcons } from '../src';
 

test/Megamenu.test.tsx

@@ -1,12 +1,10 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import { MegamenuItem, MegamenuFooter, MegamenuHighlightColumn, preloadIcons } from '../src';
+import React from 'react';
+import { MegamenuFooter, MegamenuHighlightColumn, MegamenuItem, preloadIcons } from '../src';
 
-describe('Megamenu component', () => {
-  // Icons are now async, so preload them to make it behave in an sync way
-  beforeAll(() => preloadIcons(['it-list']));
-});
+// Icons are now async, so preload them to make it behave in an sync way
+beforeAll(() => preloadIcons(['it-list']));
 
 describe('MegamenuItem component', () => {
   it('should work as container for children elements', () => {

test/Notification.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { act, fireEvent, Matcher, render, screen, waitFor, waitForElementToBeRemoved } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { NotificationId, NotificationManager, notify, preloadIcons } from '../src';
 
@@ -170,7 +170,7 @@ describe('Notifications', () => {
       expect(onClose).toHaveBeenCalled();
     });
 
-    describe('local overrides', () => {});
+    describe('local overrides', () => { });
   });
 
   describe('Notification content', () => {
@@ -219,6 +219,6 @@ describe('Notifications', () => {
       await expect(screen.findAllByRole('img')).rejects.toThrowError();
     });
 
-    it('should apply a state styling and relative icon when set', () => {});
+    it('should apply a state styling and relative icon when set', () => { });
   });
 });

test/Progress.test.tsx

@@ -1,9 +1,9 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
-import { logError } from '../src/utils';
 import { Progress } from '../src';
+import { logError } from '../src/utils';
 
 jest.mock('../src/utils', () => ({
   logError: jest.fn()

test/Rating.test.tsx

@@ -1,10 +1,10 @@
+import "@testing-library/jest-dom";
+import { fireEvent, render, screen } from '@testing-library/react';
 import React from 'react';
-import { render, fireEvent, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
 
-import * as Utils from '../src/utils';
-import { isCustomLegendObject } from '../src/Rating/Rating';
 import { Rating, preloadIcons } from '../src';
+import { isCustomLegendObject } from '../src/Rating/Rating';
+import * as Utils from '../src/utils';
 
 jest.mock('./../src/utils', () => {
   const utilModule = jest.requireActual('./../src/utils');

test/Section.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { Section } from '../src';
 import { muteConsoleWithCheck } from './helper';

test/StepperHeaderElement.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { preloadIcons, StepperHeaderElement } from '../src';
 

test/TextArea.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { TextArea } from '../src';
 

test/TimelinePin.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 
 import { preloadIcons, TimelinePin } from '../src';
 

test/Toolbar.test.tsx

@@ -1,7 +1,7 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import { preloadIcons, Toolbar, ToolbarItem } from '../src';
+import React from 'react';
+import { Toolbar, ToolbarItem, preloadIcons } from '../src';
 
 describe('Toolbar component', () => {
   // Icons are now async, so preload them to make it behave in an sync way

test/ToolbarDividerItem.test.tsx

@@ -1,6 +1,6 @@
-import React from 'react';
+import "@testing-library/jest-dom";
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import React from 'react';
 import { ToolbarDividerItem } from '../src';
 
 describe('ToolbarDividerItem component', () => {

test/ToolbarItem.test.tsx

@@ -1,7 +1,7 @@
-import React, { ReactElement } from 'react';
+import "@testing-library/jest-dom";
 import { fireEvent, render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import { ToolbarItem, preloadIcons, Toolbar } from '../src';
+import React, { ReactElement } from 'react';
+import { Toolbar, ToolbarItem, preloadIcons } from '../src';
 
 function renderWithSize(size: 'small' | 'medium' | 'large', ui: ReactElement) {
   return render(<Toolbar size={size}>{ui}</Toolbar>);