From 530ef1b4637ec881d02c9c63bf3c9c082358dd81 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@icloud.com>
Date: Mon, 22 Aug 2022 16:27:20 +0000
Subject: [PATCH 1/3] fix(breadcrumb): separator is not announced by narrators

---
 core/src/components/breadcrumb/breadcrumb.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/core/src/components/breadcrumb/breadcrumb.tsx b/core/src/components/breadcrumb/breadcrumb.tsx
index a565d089d1f..169f2821feb 100644
--- a/core/src/components/breadcrumb/breadcrumb.tsx
+++ b/core/src/components/breadcrumb/breadcrumb.tsx
@@ -222,7 +222,7 @@ export class Breadcrumb implements ComponentInterface {
           </button>
         )}
         {showSeparator && (
-          <span class="breadcrumb-separator" part="separator">
+          <span class="breadcrumb-separator" part="separator" aria-hidden="true">
             <slot name="separator">
               {mode === 'ios' ? (
                 <ion-icon icon={chevronForwardOutline} lazy={false} flip-rtl></ion-icon>

From c8f3728afe8ded75bcfa867460389113ce4dce97 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@icloud.com>
Date: Mon, 22 Aug 2022 16:32:05 +0000
Subject: [PATCH 2/3] chore(): add comment

---
 core/src/components/breadcrumb/breadcrumb.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/core/src/components/breadcrumb/breadcrumb.tsx b/core/src/components/breadcrumb/breadcrumb.tsx
index 169f2821feb..c344f6fb68c 100644
--- a/core/src/components/breadcrumb/breadcrumb.tsx
+++ b/core/src/components/breadcrumb/breadcrumb.tsx
@@ -222,6 +222,11 @@ export class Breadcrumb implements ComponentInterface {
           </button>
         )}
         {showSeparator && (
+          /**
+           * Separators should not be announced by narrators.
+           * We add aria-hidden on the span so that this applies
+           * to any custom separators too.
+           */
           <span class="breadcrumb-separator" part="separator" aria-hidden="true">
             <slot name="separator">
               {mode === 'ios' ? (

From 49d8395fe6121dbc1af3abf3c3ddd1aee189d0c9 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@icloud.com>
Date: Mon, 22 Aug 2022 16:32:13 +0000
Subject: [PATCH 3/3] test(breadcrumb): add aria hidden check

---
 .../breadcrumbs/test/breadcrumbs.spec.ts        | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/core/src/components/breadcrumbs/test/breadcrumbs.spec.ts b/core/src/components/breadcrumbs/test/breadcrumbs.spec.ts
index 8424e3c2fa0..9166df3d81b 100644
--- a/core/src/components/breadcrumbs/test/breadcrumbs.spec.ts
+++ b/core/src/components/breadcrumbs/test/breadcrumbs.spec.ts
@@ -34,3 +34,20 @@ it('should correctly provide the collapsed breadcrumbs in the event payload', as
   expect(collapsedBreadcrumbs[1]).toBe(breadcrumb[2]);
   expect(collapsedBreadcrumbs[2]).toBe(breadcrumb[3]);
 });
+
+it('should exclude the separator from narrators', async () => {
+  const page = await newSpecPage({
+    components: [Breadcrumbs, Breadcrumb],
+    html: `
+      <ion-breadcrumbs>
+        <ion-breadcrumb>First</ion-breadcrumb>
+        <ion-breadcrumb>Second</ion-breadcrumb>
+      </ion-breadcrumbs>
+    `,
+  });
+
+  const firstBreadcrumb = page.body.querySelector('ion-breadcrumb:first-of-type');
+  const separator = firstBreadcrumb.shadowRoot.querySelector('[part="separator"]');
+
+  expect(separator.getAttribute('aria-hidden')).toBe('true');
+});