diff --git a/app/assets/javascripts/vue_shared/components/ci_icon/ci_icon.vue b/app/assets/javascripts/vue_shared/components/ci_icon/ci_icon.vue
index 1a22edc2beb0d4c355250ba87c034d18396262cb..14da1d84890ff673a1683fe982268f88148ba408 100644
--- a/app/assets/javascripts/vue_shared/components/ci_icon/ci_icon.vue
+++ b/app/assets/javascripts/vue_shared/components/ci_icon/ci_icon.vue
@@ -1,5 +1,6 @@
 <script>
 import { GlBadge, GlTooltipDirective, GlIcon } from '@gitlab/ui';
+import { sprintf, __ } from '~/locale';
 
 /**
  * Renders CI icon based on API response shared between all places where it is used.
@@ -58,11 +59,7 @@ export default {
       return null;
     },
     ariaLabel() {
-      // show aria-label only when text is not rendered
-      if (!this.showStatusText) {
-        return this.status?.text;
-      }
-      return null;
+      return sprintf(__('Status: %{status}'), { status: this.status?.text });
     },
     href() {
       // href can come from GraphQL (camelCase) or REST API (snake_case)
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index a658c22500e57a4b428fe36854eb7911217ec47d..d7f4cd5484d11233ae5262c4d313725ba7b11fa2 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -48052,6 +48052,9 @@ msgstr ""
 msgid "Status:"
 msgstr ""
 
+msgid "Status: %{status}"
+msgstr ""
+
 msgid "Status: %{title}"
 msgstr ""
 
diff --git a/spec/frontend/vue_shared/components/ci_icon/ci_icon_spec.js b/spec/frontend/vue_shared/components/ci_icon/ci_icon_spec.js
index 792470c8e89863309845a1f8131b8366a894076c..c5215958ccb2da2aa9eda730e1b6ba9deb10350a 100644
--- a/spec/frontend/vue_shared/components/ci_icon/ci_icon_spec.js
+++ b/spec/frontend/vue_shared/components/ci_icon/ci_icon_spec.js
@@ -30,14 +30,14 @@ describe('CI Icon component', () => {
   });
 
   describe.each`
-    showStatusText | showTooltip | expectedText | expectedTooltip | expectedAriaLabel
-    ${true}        | ${true}     | ${'Success'} | ${undefined}    | ${undefined}
-    ${true}        | ${false}    | ${'Success'} | ${undefined}    | ${undefined}
-    ${false}       | ${true}     | ${''}        | ${'Success'}    | ${'Success'}
-    ${false}       | ${false}    | ${''}        | ${undefined}    | ${'Success'}
+    showStatusText | showTooltip | expectedText | expectedTooltip
+    ${true}        | ${true}     | ${'Success'} | ${undefined}
+    ${true}        | ${false}    | ${'Success'} | ${undefined}
+    ${false}       | ${true}     | ${''}        | ${'Success'}
+    ${false}       | ${false}    | ${''}        | ${undefined}
   `(
     'when showStatusText is %{showStatusText} and showTooltip is %{showTooltip}',
-    ({ showStatusText, showTooltip, expectedText, expectedTooltip, expectedAriaLabel }) => {
+    ({ showStatusText, showTooltip, expectedText, expectedTooltip }) => {
       beforeEach(() => {
         createComponent({
           props: {
@@ -47,15 +47,15 @@ describe('CI Icon component', () => {
         });
       });
 
-      it(`aria-label is ${expectedAriaLabel}`, () => {
-        expect(wrapper.attributes('aria-label')).toBe(expectedAriaLabel);
+      it(`aria-label is set`, () => {
+        expect(wrapper.attributes('aria-label')).toBe('Status: Success');
       });
 
-      it(`text shown is ${expectedAriaLabel}`, () => {
+      it(`text shown is ${expectedText}`, () => {
         expect(wrapper.text()).toBe(expectedText);
       });
 
-      it(`tooltip shown is ${expectedAriaLabel}`, () => {
+      it(`tooltip shown is ${expectedTooltip}`, () => {
         expect(wrapper.attributes('title')).toBe(expectedTooltip);
       });
     },