@@ -277,7 +277,7 @@ describe('Markup', () => {
const user = userEvent.setup({delay: null})
const {getByRole} = renderWithTheme(
- Focusable element
+ Focusable element
Item 1
@@ -318,13 +318,13 @@ describe('Markup', () => {
Item 1
Item 2
-
+
Link in Item 2
Item 3
- Focusable element
+ Focusable element
,
)
@@ -1359,7 +1359,9 @@ describe('Asyncronous loading', () => {
return (
{/* Mimic the completion of async loading by clicking the button */}
- setState('done')}>Done
+ setState('done')}>
+ Done
+
Parent
diff --git a/packages/react/src/UnderlineNav/UnderlineNav.test.tsx b/packages/react/src/UnderlineNav/UnderlineNav.test.tsx
index bd1551a39225..5d7793390a31 100644
--- a/packages/react/src/UnderlineNav/UnderlineNav.test.tsx
+++ b/packages/react/src/UnderlineNav/UnderlineNav.test.tsx
@@ -67,7 +67,7 @@ const ResponsiveUnderlineNav = ({
))}
- {displayExtraEl && Custom button }
+ {displayExtraEl && Custom button }
)
}
diff --git a/packages/react/src/__tests__/Dialog.test.tsx b/packages/react/src/__tests__/Dialog.test.tsx
index 281f4c5d641d..0fed5ca5172c 100644
--- a/packages/react/src/__tests__/Dialog.test.tsx
+++ b/packages/react/src/__tests__/Dialog.test.tsx
@@ -61,7 +61,7 @@ const DialogWithCustomFocusRef = () => {
Some content
-
+
hi
@@ -90,7 +90,7 @@ const DialogWithCustomFocusRefAndReturnFocusRef = () => {
Some content
-
+
hi
diff --git a/packages/react/src/__tests__/TextInputWithTokens.test.tsx b/packages/react/src/__tests__/TextInputWithTokens.test.tsx
index d70ec90d97d5..10a21222184c 100644
--- a/packages/react/src/__tests__/TextInputWithTokens.test.tsx
+++ b/packages/react/src/__tests__/TextInputWithTokens.test.tsx
@@ -317,7 +317,9 @@ describe('TextInputWithTokens', () => {
onTokenRemove={onRemoveMock}
visibleTokenCount={visibleTokenCount}
/>
- Focus me
+
+ Focus me
+
>,
)
const inputNode = getByLabelText('Tokens')
@@ -373,7 +375,9 @@ describe('TextInputWithTokens', () => {
onTokenRemove={onRemoveMock}
visibleTokenCount={visibleTokenCount}
/>
- Focus me
+
+ Focus me
+
>,
)
const inputNode = getByLabelText('Tokens')
diff --git a/packages/react/src/__tests__/ThemeProvider.test.tsx b/packages/react/src/__tests__/ThemeProvider.test.tsx
index c94e6d3fd722..66d79d2590c1 100644
--- a/packages/react/src/__tests__/ThemeProvider.test.tsx
+++ b/packages/react/src/__tests__/ThemeProvider.test.tsx
@@ -203,7 +203,9 @@ it('updates when colorMode prop changes', async () => {
return (
{colorMode}
- setColorMode(colorMode === 'day' ? 'night' : 'day')}>Toggle
+ setColorMode(colorMode === 'day' ? 'night' : 'day')}>
+ Toggle
+
)
}
@@ -229,7 +231,9 @@ it('updates when dayScheme prop changes', async () => {
return (
{dayScheme}
- setDayScheme(dayScheme === 'light' ? 'dark_dimmed' : 'light')}>Toggle
+ setDayScheme(dayScheme === 'light' ? 'dark_dimmed' : 'light')}>
+ Toggle
+
)
}
@@ -255,7 +259,9 @@ it('updates when nightScheme prop changes', async () => {
return (
{nightScheme}
- setNightScheme(nightScheme === 'dark' ? 'dark_dimmed' : 'dark')}>Toggle
+ setNightScheme(nightScheme === 'dark' ? 'dark_dimmed' : 'dark')}>
+ Toggle
+
)
}
@@ -280,7 +286,9 @@ it('inherits colorMode from parent', async () => {
const [colorMode, setcolorMode] = React.useState<'day' | 'night'>('day')
return (
- setcolorMode(colorMode === 'day' ? 'night' : 'day')}>Toggle
+ setcolorMode(colorMode === 'day' ? 'night' : 'day')}>
+ Toggle
+
{colorMode}
@@ -304,7 +312,9 @@ it('inherits dayScheme from parent', async () => {
const [dayScheme, setDayScheme] = React.useState('light')
return (
- setDayScheme(dayScheme === 'light' ? 'dark_dimmed' : 'light')}>Toggle
+ setDayScheme(dayScheme === 'light' ? 'dark_dimmed' : 'light')}>
+ Toggle
+
{dayScheme}
@@ -328,7 +338,9 @@ it('inherits nightScheme from parent', async () => {
const [nightScheme, setNightScheme] = React.useState('dark')
return (
- setNightScheme(nightScheme === 'dark' ? 'dark_dimmed' : 'dark')}>Toggle
+ setNightScheme(nightScheme === 'dark' ? 'dark_dimmed' : 'dark')}>
+ Toggle
+
{nightScheme}
@@ -351,7 +363,11 @@ describe('setColorMode', () => {
function ToggleMode() {
const {colorMode, setColorMode} = useTheme()
- return setColorMode(colorMode === 'day' ? 'night' : 'day')}>Toggle
+ return (
+ setColorMode(colorMode === 'day' ? 'night' : 'day')}>
+ Toggle
+
+ )
}
render(
@@ -377,7 +393,11 @@ describe('setDayScheme', () => {
function ToggleDayScheme() {
const {dayScheme, setDayScheme} = useTheme()
- return setDayScheme(dayScheme === 'light' ? 'dark' : 'light')}>Toggle
+ return (
+ setDayScheme(dayScheme === 'light' ? 'dark' : 'light')}>
+ Toggle
+
+ )
}
render(
@@ -403,7 +423,11 @@ describe('setNightScheme', () => {
function ToggleNightScheme() {
const {nightScheme, setNightScheme} = useTheme()
- return setNightScheme(nightScheme === 'dark' ? 'dark_dimmed' : 'dark')}>Toggle
+ return (
+ setNightScheme(nightScheme === 'dark' ? 'dark_dimmed' : 'dark')}>
+ Toggle
+
+ )
}
render(
@@ -429,7 +453,11 @@ describe('useColorSchemeVar', () => {
function ToggleMode() {
const {colorMode, setColorMode} = useTheme()
- return setColorMode(colorMode === 'day' ? 'night' : 'day')}>Toggle
+ return (
+ setColorMode(colorMode === 'day' ? 'night' : 'day')}>
+ Toggle
+
+ )
}
function CustomBg() {
@@ -464,7 +492,11 @@ describe('useColorSchemeVar', () => {
function ToggleMode() {
const {colorMode, setColorMode} = useTheme()
- return setColorMode(colorMode === 'day' ? 'night' : 'day')}>Toggle
+ return (
+ setColorMode(colorMode === 'day' ? 'night' : 'day')}>
+ Toggle
+
+ )
}
function CustomBg() {
diff --git a/packages/react/src/__tests__/hooks/useMenuInitialFocus.test.tsx b/packages/react/src/__tests__/hooks/useMenuInitialFocus.test.tsx
index e5d5dc65ce7f..7519ca1a1d59 100644
--- a/packages/react/src/__tests__/hooks/useMenuInitialFocus.test.tsx
+++ b/packages/react/src/__tests__/hooks/useMenuInitialFocus.test.tsx
@@ -12,15 +12,15 @@ const Component = () => {
return (
<>
- onOpen()} onKeyDown={() => onOpen()}>
+ onOpen()} onKeyDown={() => onOpen()}>
open container
{open && (
not focusable
- first focusable element
- second focusable element
- third focusable element
+ first focusable element
+ second focusable element
+ third focusable element
not focusable
)}
diff --git a/packages/react/src/__tests__/hooks/useMnemonics.test.tsx b/packages/react/src/__tests__/hooks/useMnemonics.test.tsx
index 6b2949c74048..2070db576219 100644
--- a/packages/react/src/__tests__/hooks/useMnemonics.test.tsx
+++ b/packages/react/src/__tests__/hooks/useMnemonics.test.tsx
@@ -21,12 +21,22 @@ const Fixture = ({
{hasInput &&
}
{hasTextarea &&
}
-
button 1
-
Button 2
-
third button
-
fourth button is disabled
-
button 5
-
+
+ button 1
+
+
+ Button 2
+
+
+ third button
+
+
+ fourth button is disabled
+
+
+ button 5
+
+
button 6
not focusable
diff --git a/packages/react/src/__tests__/hooks/useOnOutsideClick.test.tsx b/packages/react/src/__tests__/hooks/useOnOutsideClick.test.tsx
index f3c4d711d20c..d1f5fd9a50e8 100644
--- a/packages/react/src/__tests__/hooks/useOnOutsideClick.test.tsx
+++ b/packages/react/src/__tests__/hooks/useOnOutsideClick.test.tsx
@@ -13,8 +13,12 @@ const Component = ({callback}: ComponentProps) => {
useOnOutsideClick({ignoreClickRefs: [secondButton], containerRef, onClickOutside: callback})
return (
-
button
-
button two
+
+ button
+
+
+ button two
+
content
)
diff --git a/packages/react/src/__tests__/hooks/useOpenAndCloseFocus.test.tsx b/packages/react/src/__tests__/hooks/useOpenAndCloseFocus.test.tsx
index 57d19af70cda..a05421af1c52 100644
--- a/packages/react/src/__tests__/hooks/useOpenAndCloseFocus.test.tsx
+++ b/packages/react/src/__tests__/hooks/useOpenAndCloseFocus.test.tsx
@@ -9,10 +9,14 @@ const Component = () => {
useOpenAndCloseFocus({containerRef, initialFocusRef: noButtonRef, returnFocusRef})
return (
<>
- trigger
+
+ trigger
+
- yes
- no
+ yes
+
+ no
+
>
)
@@ -24,10 +28,12 @@ const ComponentTwo = () => {
useOpenAndCloseFocus({containerRef, returnFocusRef: buttonRef})
return (
<>
- button trigger
+
+ button trigger
+
- yes
- no
+ yes
+ no
>
)
diff --git a/packages/react/src/experimental/UnderlinePanels/UnderlinePanels.tsx b/packages/react/src/experimental/UnderlinePanels/UnderlinePanels.tsx
index 9801211c9e2f..b683cb350547 100644
--- a/packages/react/src/experimental/UnderlinePanels/UnderlinePanels.tsx
+++ b/packages/react/src/experimental/UnderlinePanels/UnderlinePanels.tsx
@@ -177,6 +177,7 @@ const Tab: FC = ({'aria-selected': ariaSelected, sx: sxProp = defaultS
tabIndex={ariaSelected ? 0 : -1}
aria-selected={ariaSelected}
sx={sxProp}
+ type="button"
{...props}
/>
)