fix tests

mui · Aug 22, 2023 · 69d7cfa · 69d7cfa
1 parent 08234e2
commit 69d7cfa
Showing 1 changed file with 25 additions and 23 deletions.
diff --git a/packages/mui-joy/src/AccordionDetails/AccordionDetails.test.tsx b/packages/mui-joy/src/AccordionDetails/AccordionDetails.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, fireEvent } from 'test/utils';
+import { createRenderer, describeConformance, fireEvent, screen } from 'test/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Accordion from '@mui/joy/Accordion';
 import AccordionSummary from '@mui/joy/AccordionSummary';
@@ -30,57 +30,59 @@ describe('<AccordionDetails />', () => {
 
   describe('tab index', () => {
     it('[initial] interactive content should have tab index -1', () => {
-      const { getByRole } = render(
+      render(
         <Accordion>
           <AccordionDetails>
-            <a href="/foo">Hello</a>
-            <input />
+            <a href="/foo" data-testid="link">
+              Hello
+            </a>
+            <input data-testid="textbox" />
           </AccordionDetails>
         </Accordion>,
       );
 
-      expect(getByRole('link')).to.have.property('tabIndex', -1);
-      expect(getByRole('textbox')).to.have.property('tabIndex', -1);
+      expect(screen.getByTestId('link')).to.have.property('tabIndex', -1);
+      expect(screen.getByTestId('textbox')).to.have.property('tabIndex', -1);
     });
 
     it('[expanded] interactive content should not have tab index 0', () => {
-      const { getByRole } = render(
+      render(
         <Accordion expanded>
           <AccordionDetails>
-            <a href="/foo">Hello</a>
-            {/* eslint-disable-next-line jsx-a11y/no-redundant-roles */}
-            <input type="text" role="textbox" />
+            <a href="/foo" data-testid="link">
+              Hello
+            </a>
+            <input data-testid="textbox" />
           </AccordionDetails>
         </Accordion>,
       );
 
-      expect(getByRole('link')).to.have.property('tabIndex', 0);
-      expect(getByRole('textbox')).to.have.property('tabIndex', 0);
+      expect(screen.getByTestId('link')).to.have.property('tabIndex', 0);
+      expect(screen.getByTestId('textbox')).to.have.property('tabIndex', 0);
     });
 
     it('interactive content should preserve the tab index when closed', () => {
-      const { getByRole } = render(
+      render(
         <Accordion defaultExpanded>
           <AccordionSummary>title</AccordionSummary>
           <AccordionDetails>
-            {/* eslint-disable-next-line jsx-a11y/no-redundant-roles */}
-            <input tabIndex={2} type="text" role="textbox" />
+            <input tabIndex={2} data-testid="textbox" />
           </AccordionDetails>
         </Accordion>,
       );
 
-      expect(getByRole('button')).to.have.attribute('aria-expanded', 'true');
-      expect(getByRole('textbox')).to.have.property('tabIndex', 2);
+      expect(screen.getByRole('button')).to.have.attribute('aria-expanded', 'true');
+      expect(screen.getByTestId('textbox')).to.have.property('tabIndex', 2);
 
-      fireEvent.click(getByRole('button')); // close
+      fireEvent.click(screen.getByRole('button')); // close
 
-      expect(getByRole('button')).to.have.attribute('aria-expanded', 'false');
-      expect(getByRole('textbox')).to.have.property('tabIndex', -1);
+      expect(screen.getByRole('button')).to.have.attribute('aria-expanded', 'false');
+      expect(screen.getByTestId('textbox')).to.have.property('tabIndex', -1);
 
-      fireEvent.click(getByRole('button')); // reopen
+      fireEvent.click(screen.getByRole('button')); // reopen
 
-      expect(getByRole('button')).to.have.attribute('aria-expanded', 'true');
-      expect(getByRole('textbox')).to.have.property('tabIndex', 2);
+      expect(screen.getByRole('button')).to.have.attribute('aria-expanded', 'true');
+      expect(screen.getByTestId('textbox')).to.have.property('tabIndex', 2);
     });
   });
 });