diff --git a/src/components/BackgroundMedia/__tests__/BackgroundMedia.test.tsx b/src/components/BackgroundMedia/__tests__/BackgroundMedia.test.tsx
index 200a99e59..c861b3bd6 100644
--- a/src/components/BackgroundMedia/__tests__/BackgroundMedia.test.tsx
+++ b/src/components/BackgroundMedia/__tests__/BackgroundMedia.test.tsx
@@ -4,7 +4,12 @@ import {render, screen} from '@testing-library/react';
 
 import {testAnimated, testCustomClassName} from '../../../../test-utils/shared/common';
 import {qaIdByDefault as qaIdOfBackgroundImage} from '../../../components/BackgroundImage/BackgroundImage';
+import {defaultAnimatedDivQa} from '../../../components/Media/Image/Image';
 import {qaIdByDefault as qaIdOfMedia} from '../../../components/Media/Media';
+import {
+    defaultMediaVideoQa,
+    defaultMediaVideoSourceQa,
+} from '../../../components/Media/Video/Video';
 import {BackgroundMediaProps} from '../../../models';
 import BackgroundMedia from '../BackgroundMedia';
 
@@ -60,14 +65,14 @@ describe('BackgroundMedia', () => {
 
     test('render video', () => {
         render(<BackgroundMedia qa={qaId} video={videoProps} />);
-        const component = screen.getByRole('media-video-source');
+        const component = screen.getByTestId(defaultMediaVideoSourceQa);
 
         expect(component).toBeInTheDocument();
     });
 
     test('render video with videoClassName', () => {
         render(<BackgroundMedia qa={qaId} video={videoProps} />);
-        const component = screen.getByRole('media-video');
+        const component = screen.getByTestId(defaultMediaVideoQa);
 
         expect(component).toHaveClass('pc-BackgroundMedia__video');
     });
@@ -75,7 +80,7 @@ describe('BackgroundMedia', () => {
     test('render video with default height', () => {
         const style = {height: '720px'};
         render(<BackgroundMedia qa={qaId} video={videoProps} />);
-        const component = screen.getByRole('media-video');
+        const component = screen.getByTestId(defaultMediaVideoQa);
 
         expect(component).toHaveStyle(style);
     });
@@ -85,7 +90,7 @@ describe('BackgroundMedia', () => {
         const style = {height: `${height}px`};
 
         render(<BackgroundMedia qa={qaId} video={videoProps} height={height} />);
-        const component = screen.getByRole('media-video');
+        const component = screen.getByTestId(defaultMediaVideoQa);
         expect(component).toHaveStyle(style);
     });
 
@@ -139,7 +144,7 @@ describe('BackgroundMedia', () => {
         const style = {transform: 'translateY(0px)'};
 
         render(<BackgroundMedia qa={qaId} parallax image={imageUrl} />);
-        const component = screen.getByRole('animated-div');
+        const component = screen.getByTestId(defaultAnimatedDivQa);
 
         expect(component).toHaveStyle(style);
     });
diff --git a/src/components/Media/Image/Image.tsx b/src/components/Media/Image/Image.tsx
index bec311f47..3244832a3 100644
--- a/src/components/Media/Image/Image.tsx
+++ b/src/components/Media/Image/Image.tsx
@@ -28,6 +28,8 @@ interface InnerImageProps {
 
 type ImageAllProps = ImageAdditionProps & MediaComponentImageProps & InnerImageProps;
 
+export const defaultAnimatedDivQa = 'animated-div';
+
 const Image = (props: ImageAllProps) => {
     const {
         parallax,
@@ -84,7 +86,7 @@ const Image = (props: ImageAllProps) => {
     const imageBackground = (oneImage: ImageProps) => {
         const imageData = getMediaImage(oneImage);
         return (
-            <animated.div style={{transform: parallaxInterpolate}} role="animated-div">
+            <animated.div style={{transform: parallaxInterpolate}} data-qa={defaultAnimatedDivQa}>
                 <BackgroundImage {...imageData} className={imageClass} style={{height}} />
             </animated.div>
         );
diff --git a/src/components/Media/Video/Video.tsx b/src/components/Media/Video/Video.tsx
index 7cee772d0..a63ec79e4 100644
--- a/src/components/Media/Video/Video.tsx
+++ b/src/components/Media/Video/Video.tsx
@@ -10,6 +10,9 @@ import './Video.scss';
 
 const b = block('media-component-video');
 
+export const defaultMediaVideoQa = 'media-video';
+export const defaultMediaVideoSourceQa = 'media-video-source';
+
 export interface VideoAdditionProps {
     playButton?: PlayButtonProps;
     customBarControlsClassName?: string;
@@ -103,7 +106,11 @@ const Video = (props: VideoAllProps) => {
 
     const defaultVideoBlock = useMemo(() => {
         return video.src.length && !hasVideoFallback ? (
-            <div className={b('wrap', videoClassName)} style={{height}} role="media-video">
+            <div
+                className={b('wrap', videoClassName)}
+                style={{height}}
+                data-qa={defaultMediaVideoQa}
+            >
                 <video
                     disablePictureInPicture={true}
                     playsInline={true}
@@ -115,7 +122,12 @@ const Video = (props: VideoAllProps) => {
                     muted={true}
                 >
                     {getVideoTypesWithPriority(video.src).map(({src, type}, index) => (
-                        <source key={index} src={src} type={type} role="media-video-source" />
+                        <source
+                            key={index}
+                            src={src}
+                            type={type}
+                            data-qa={defaultMediaVideoSourceQa}
+                        />
                     ))}
                 </video>
             </div>