From 3ea76419c85e896ac26d05486ed6b792e282c8c1 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Wed, 23 Feb 2022 20:41:24 +0100
Subject: [PATCH] fix(material/autocomplete): use narrow value for
 aria-haspopup (#15361)

[Based on the spec](https://www.w3.org/TR/wai-aria-1.1/#aria-haspopup),
`aria-haspopup` can be set to indicate what kind of popup the element has.
These changes update the autocomplete one to show that it opens a listbox.

(cherry picked from commit 7e9916bc9ea4b4360f099b395891a50ab297e026)
---
 .../mdc-autocomplete/autocomplete-trigger.ts                  | 2 +-
 .../mdc-autocomplete/autocomplete.spec.ts                     | 4 ++--
 src/material/autocomplete/autocomplete-trigger.ts             | 2 +-
 src/material/autocomplete/autocomplete.spec.ts                | 4 ++--
 4 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/material-experimental/mdc-autocomplete/autocomplete-trigger.ts b/src/material-experimental/mdc-autocomplete/autocomplete-trigger.ts
index 5a1e3c5f7c4c..97f9a89eb8f5 100644
--- a/src/material-experimental/mdc-autocomplete/autocomplete-trigger.ts
+++ b/src/material-experimental/mdc-autocomplete/autocomplete-trigger.ts
@@ -34,7 +34,7 @@ export const MAT_AUTOCOMPLETE_VALUE_ACCESSOR: any = {
     '[attr.aria-activedescendant]': '(panelOpen && activeOption) ? activeOption.id : null',
     '[attr.aria-expanded]': 'autocompleteDisabled ? null : panelOpen.toString()',
     '[attr.aria-owns]': '(autocompleteDisabled || !panelOpen) ? null : autocomplete?.id',
-    '[attr.aria-haspopup]': '!autocompleteDisabled',
+    '[attr.aria-haspopup]': 'autocompleteDisabled ? null : "listbox"',
     // Note: we use `focusin`, as opposed to `focus`, in order to open the panel
     // a little earlier. This avoids issues where IE delays the focusing of the input.
     '(focusin)': '_handleFocus()',
diff --git a/src/material-experimental/mdc-autocomplete/autocomplete.spec.ts b/src/material-experimental/mdc-autocomplete/autocomplete.spec.ts
index a763addaa700..18b4617393cb 100644
--- a/src/material-experimental/mdc-autocomplete/autocomplete.spec.ts
+++ b/src/material-experimental/mdc-autocomplete/autocomplete.spec.ts
@@ -562,12 +562,12 @@ describe('MDC-based MatAutocomplete', () => {
     });
 
     it('should set aria-haspopup depending on whether the autocomplete is disabled', () => {
-      expect(input.getAttribute('aria-haspopup')).toBe('true');
+      expect(input.getAttribute('aria-haspopup')).toBe('listbox');
 
       fixture.componentInstance.autocompleteDisabled = true;
       fixture.detectChanges();
 
-      expect(input.getAttribute('aria-haspopup')).toBe('false');
+      expect(input.hasAttribute('aria-haspopup')).toBe(false);
     });
   });
 
diff --git a/src/material/autocomplete/autocomplete-trigger.ts b/src/material/autocomplete/autocomplete-trigger.ts
index be87ee1de4f7..e5c4cc9bf150 100644
--- a/src/material/autocomplete/autocomplete-trigger.ts
+++ b/src/material/autocomplete/autocomplete-trigger.ts
@@ -792,7 +792,7 @@ export abstract class _MatAutocompleteTriggerBase
     '[attr.aria-activedescendant]': '(panelOpen && activeOption) ? activeOption.id : null',
     '[attr.aria-expanded]': 'autocompleteDisabled ? null : panelOpen.toString()',
     '[attr.aria-owns]': '(autocompleteDisabled || !panelOpen) ? null : autocomplete?.id',
-    '[attr.aria-haspopup]': '!autocompleteDisabled',
+    '[attr.aria-haspopup]': 'autocompleteDisabled ? null : "listbox"',
     // Note: we use `focusin`, as opposed to `focus`, in order to open the panel
     // a little earlier. This avoids issues where IE delays the focusing of the input.
     '(focusin)': '_handleFocus()',
diff --git a/src/material/autocomplete/autocomplete.spec.ts b/src/material/autocomplete/autocomplete.spec.ts
index 1fa9b9db4810..6a772f8cedbd 100644
--- a/src/material/autocomplete/autocomplete.spec.ts
+++ b/src/material/autocomplete/autocomplete.spec.ts
@@ -559,12 +559,12 @@ describe('MatAutocomplete', () => {
     });
 
     it('should set aria-haspopup depending on whether the autocomplete is disabled', () => {
-      expect(input.getAttribute('aria-haspopup')).toBe('true');
+      expect(input.getAttribute('aria-haspopup')).toBe('listbox');
 
       fixture.componentInstance.autocompleteDisabled = true;
       fixture.detectChanges();
 
-      expect(input.getAttribute('aria-haspopup')).toBe('false');
+      expect(input.hasAttribute('aria-haspopup')).toBe(false);
     });
   });