diff --git a/packages/roomkit-react/src/Prebuilt/components/AudioVideoToggle.tsx b/packages/roomkit-react/src/Prebuilt/components/AudioVideoToggle.tsx
index acbbb3a20b..7beece4dc9 100644
--- a/packages/roomkit-react/src/Prebuilt/components/AudioVideoToggle.tsx
+++ b/packages/roomkit-react/src/Prebuilt/components/AudioVideoToggle.tsx
@@ -310,10 +310,9 @@ export const AudioVideoToggle = ({ hideOptions = false }: { hideOptions?: boolea
disabled={!toggleAudio}
hideOptions={hideOptions || !hasAudioDevices}
onDisabledClick={toggleAudio}
+ testid="audio_toggle_btn"
tooltipMessage={`Turn ${isLocalAudioEnabled ? 'off' : 'on'} audio (${isMacOS ? '⌘' : 'ctrl'} + d)`}
- icon={
- !isLocalAudioEnabled ? :
- }
+ icon={!isLocalAudioEnabled ? : }
active={isLocalAudioEnabled}
onClick={toggleAudio}
key="toggleAudio"
@@ -353,13 +352,8 @@ export const AudioVideoToggle = ({ hideOptions = false }: { hideOptions?: boolea
hideOptions={hideOptions || !hasVideoDevices}
onDisabledClick={toggleVideo}
tooltipMessage={`Turn ${isLocalVideoEnabled ? 'off' : 'on'} video (${isMacOS ? '⌘' : 'ctrl'} + e)`}
- icon={
- !isLocalVideoEnabled ? (
-
- ) : (
-
- )
- }
+ testid="video_toggle_btn"
+ icon={!isLocalVideoEnabled ? : }
key="toggleVideo"
active={isLocalVideoEnabled}
onClick={toggleVideo}
diff --git a/packages/roomkit-react/src/Prebuilt/components/IconButtonWithOptions/IconButtonWithOptions.tsx b/packages/roomkit-react/src/Prebuilt/components/IconButtonWithOptions/IconButtonWithOptions.tsx
index e475aaf19b..288167edea 100644
--- a/packages/roomkit-react/src/Prebuilt/components/IconButtonWithOptions/IconButtonWithOptions.tsx
+++ b/packages/roomkit-react/src/Prebuilt/components/IconButtonWithOptions/IconButtonWithOptions.tsx
@@ -90,6 +90,7 @@ export const IconButtonWithOptions = ({
onDisabledClick = () => {
return;
},
+ testid = '',
tooltipMessage = '',
icon,
children,
@@ -103,6 +104,7 @@ export const IconButtonWithOptions = ({
onDisabledClick: () => void;
icon: React.ReactNode;
children: React.ReactNode;
+ testid?: string;
hideOptions?: boolean;
active: boolean;
disabled?: boolean;
@@ -111,7 +113,13 @@ export const IconButtonWithOptions = ({
const commonProps = { disabled, active };
return (
-
+
{icon}