@angular/material 10.1.1 → 10.2.0

package/fesm2015/select/testing.js.map

@@ -1 +1 @@
-{"version":3,"file":"select__testing.js","sources":["../../../../../../src/material/select/testing/select-harness.ts","../../../../../../src/material/select/testing/select-harness-filters.ts","../../../../../../src/material/select/testing/public-api.ts","../../../../../../src/material/select/testing/index.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {HarnessPredicate} from '@angular/cdk/testing';\nimport {MatFormFieldControlHarness} from '@angular/material/form-field/testing/control';\nimport {\n  MatOptionHarness,\n  MatOptgroupHarness,\n  OptionHarnessFilters,\n  OptgroupHarnessFilters,\n} from '@angular/material/core/testing';\nimport {SelectHarnessFilters} from './select-harness-filters';\n\n\n/** Harness for interacting with a standard mat-select in tests. */\nexport class MatSelectHarness extends MatFormFieldControlHarness {\n  private _documentRootLocator = this.documentRootLocatorFactory();\n  private _backdrop = this._documentRootLocator.locatorFor('.cdk-overlay-backdrop');\n  private _trigger = this.locatorFor('.mat-select-trigger');\n  private _value = this.locatorFor('.mat-select-value');\n\n  static hostSelector = '.mat-select';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatSelectHarness` that meets\n   * certain criteria.\n   * @param options Options for filtering which select instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: SelectHarnessFilters = {}): HarnessPredicate<MatSelectHarness> {\n    return new HarnessPredicate(MatSelectHarness, options);\n  }\n\n  /** Gets a boolean promise indicating if the select is disabled. */\n  async isDisabled(): Promise<boolean> {\n    return (await this.host()).hasClass('mat-select-disabled');\n  }\n\n  /** Gets a boolean promise indicating if the select is valid. */\n  async isValid(): Promise<boolean> {\n    return !(await (await this.host()).hasClass('ng-invalid'));\n  }\n\n  /** Gets a boolean promise indicating if the select is required. */\n  async isRequired(): Promise<boolean> {\n    return (await this.host()).hasClass('mat-select-required');\n  }\n\n  /** Gets a boolean promise indicating if the select is empty (no value is selected). */\n  async isEmpty(): Promise<boolean> {\n    return (await this.host()).hasClass('mat-select-empty');\n  }\n\n  /** Gets a boolean promise indicating if the select is in multi-selection mode. */\n  async isMultiple(): Promise<boolean> {\n    const ariaMultiselectable = (await this.host()).getAttribute('aria-multiselectable');\n    return (await ariaMultiselectable) === 'true';\n  }\n\n  /** Gets a promise for the select's value text. */\n  async getValueText(): Promise<string> {\n    return (await this._value()).text();\n  }\n\n  /** Focuses the select and returns a void promise that indicates when the action is complete. */\n  async focus(): Promise<void> {\n    return (await this.host()).focus();\n  }\n\n  /** Blurs the select and returns a void promise that indicates when the action is complete. */\n  async blur(): Promise<void> {\n    return (await this.host()).blur();\n  }\n\n  /** Whether the select is focused. */\n  async isFocused(): Promise<boolean> {\n    return (await this.host()).isFocused();\n  }\n\n  /** Gets the options inside the select panel. */\n  async getOptions(filter: Omit<OptionHarnessFilters, 'ancestor'> = {}):\n    Promise<MatOptionHarness[]> {\n    return this._documentRootLocator.locatorForAll(MatOptionHarness.with({\n      ...filter,\n      ancestor: await this._getPanelSelector()\n    }))();\n  }\n\n  /** Gets the groups of options inside the panel. */\n  async getOptionGroups(filter: Omit<OptgroupHarnessFilters, 'ancestor'> = {}):\n    Promise<MatOptgroupHarness[]> {\n    return this._documentRootLocator.locatorForAll(MatOptgroupHarness.with({\n      ...filter,\n      ancestor: await this._getPanelSelector()\n    }))();\n  }\n\n  /** Gets whether the select is open. */\n  async isOpen(): Promise<boolean> {\n    return !!await this._documentRootLocator.locatorForOptional(await this._getPanelSelector())();\n  }\n\n  /** Opens the select's panel. */\n  async open(): Promise<void> {\n    if (!await this.isOpen()) {\n      return (await this._trigger()).click();\n    }\n  }\n\n  /**\n   * Clicks the options that match the passed-in filter. If the select is in multi-selection\n   * mode all options will be clicked, otherwise the harness will pick the first matching option.\n   */\n  async clickOptions(filter: OptionHarnessFilters = {}): Promise<void> {\n    await this.open();\n\n    const [isMultiple, options] = await Promise.all([this.isMultiple(), this.getOptions(filter)]);\n\n    if (options.length === 0) {\n      throw Error('Select does not have options matching the specified filter');\n    }\n\n    if (isMultiple) {\n      await Promise.all(options.map(option => option.click()));\n    } else {\n      await options[0].click();\n    }\n  }\n\n  /** Closes the select's panel. */\n  async close(): Promise<void> {\n    if (await this.isOpen()) {\n      // This is the most consistent way that works both in both single and multi-select modes,\n      // but it assumes that only one overlay is open at a time. We should be able to make it\n      // a bit more precise after #16645 where we can dispatch an ESCAPE press to the host instead.\n      return (await this._backdrop()).click();\n    }\n  }\n\n  /** Gets the selector that should be used to find this select's panel. */\n  private async _getPanelSelector(): Promise<string> {\n    const id = await (await this.host()).getAttribute('id');\n    return `#${id}-panel`;\n  }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {BaseHarnessFilters} from '@angular/cdk/testing';\n\n/** A set of criteria that can be used to filter a list of `MatSelectHarness` instances. */\nexport interface SelectHarnessFilters extends BaseHarnessFilters {}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './select-harness';\nexport * from './select-harness-filters';\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"select__testing.js","sources":["../../../../../../src/material/select/testing/select-harness.ts","../../../../../../src/material/select/testing/select-harness-filters.ts","../../../../../../src/material/select/testing/public-api.ts","../../../../../../src/material/select/testing/index.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {HarnessPredicate} from '@angular/cdk/testing';\nimport {MatFormFieldControlHarness} from '@angular/material/form-field/testing/control';\nimport {\n  MatOptionHarness,\n  MatOptgroupHarness,\n  OptionHarnessFilters,\n  OptgroupHarnessFilters,\n} from '@angular/material/core/testing';\nimport {SelectHarnessFilters} from './select-harness-filters';\n\n\n/** Harness for interacting with a standard mat-select in tests. */\nexport class MatSelectHarness extends MatFormFieldControlHarness {\n  private _documentRootLocator = this.documentRootLocatorFactory();\n  private _backdrop = this._documentRootLocator.locatorFor('.cdk-overlay-backdrop');\n  private _trigger = this.locatorFor('.mat-select-trigger');\n  private _value = this.locatorFor('.mat-select-value');\n\n  static hostSelector = '.mat-select';\n\n  /**\n   * Gets a `HarnessPredicate` that can be used to search for a `MatSelectHarness` that meets\n   * certain criteria.\n   * @param options Options for filtering which select instances are considered a match.\n   * @return a `HarnessPredicate` configured with the given options.\n   */\n  static with(options: SelectHarnessFilters = {}): HarnessPredicate<MatSelectHarness> {\n    return new HarnessPredicate(MatSelectHarness, options);\n  }\n\n  /** Gets a boolean promise indicating if the select is disabled. */\n  async isDisabled(): Promise<boolean> {\n    return (await this.host()).hasClass('mat-select-disabled');\n  }\n\n  /** Gets a boolean promise indicating if the select is valid. */\n  async isValid(): Promise<boolean> {\n    return !(await (await this.host()).hasClass('ng-invalid'));\n  }\n\n  /** Gets a boolean promise indicating if the select is required. */\n  async isRequired(): Promise<boolean> {\n    return (await this.host()).hasClass('mat-select-required');\n  }\n\n  /** Gets a boolean promise indicating if the select is empty (no value is selected). */\n  async isEmpty(): Promise<boolean> {\n    return (await this.host()).hasClass('mat-select-empty');\n  }\n\n  /** Gets a boolean promise indicating if the select is in multi-selection mode. */\n  async isMultiple(): Promise<boolean> {\n    return (await this.host()).hasClass('mat-select-multiple');\n  }\n\n  /** Gets a promise for the select's value text. */\n  async getValueText(): Promise<string> {\n    return (await this._value()).text();\n  }\n\n  /** Focuses the select and returns a void promise that indicates when the action is complete. */\n  async focus(): Promise<void> {\n    return (await this.host()).focus();\n  }\n\n  /** Blurs the select and returns a void promise that indicates when the action is complete. */\n  async blur(): Promise<void> {\n    return (await this.host()).blur();\n  }\n\n  /** Whether the select is focused. */\n  async isFocused(): Promise<boolean> {\n    return (await this.host()).isFocused();\n  }\n\n  /** Gets the options inside the select panel. */\n  async getOptions(filter: Omit<OptionHarnessFilters, 'ancestor'> = {}):\n    Promise<MatOptionHarness[]> {\n    return this._documentRootLocator.locatorForAll(MatOptionHarness.with({\n      ...filter,\n      ancestor: await this._getPanelSelector()\n    }))();\n  }\n\n  /** Gets the groups of options inside the panel. */\n  async getOptionGroups(filter: Omit<OptgroupHarnessFilters, 'ancestor'> = {}):\n    Promise<MatOptgroupHarness[]> {\n    return this._documentRootLocator.locatorForAll(MatOptgroupHarness.with({\n      ...filter,\n      ancestor: await this._getPanelSelector()\n    }))();\n  }\n\n  /** Gets whether the select is open. */\n  async isOpen(): Promise<boolean> {\n    return !!await this._documentRootLocator.locatorForOptional(await this._getPanelSelector())();\n  }\n\n  /** Opens the select's panel. */\n  async open(): Promise<void> {\n    if (!await this.isOpen()) {\n      return (await this._trigger()).click();\n    }\n  }\n\n  /**\n   * Clicks the options that match the passed-in filter. If the select is in multi-selection\n   * mode all options will be clicked, otherwise the harness will pick the first matching option.\n   */\n  async clickOptions(filter: OptionHarnessFilters = {}): Promise<void> {\n    await this.open();\n\n    const [isMultiple, options] = await Promise.all([this.isMultiple(), this.getOptions(filter)]);\n\n    if (options.length === 0) {\n      throw Error('Select does not have options matching the specified filter');\n    }\n\n    if (isMultiple) {\n      await Promise.all(options.map(option => option.click()));\n    } else {\n      await options[0].click();\n    }\n  }\n\n  /** Closes the select's panel. */\n  async close(): Promise<void> {\n    if (await this.isOpen()) {\n      // This is the most consistent way that works both in both single and multi-select modes,\n      // but it assumes that only one overlay is open at a time. We should be able to make it\n      // a bit more precise after #16645 where we can dispatch an ESCAPE press to the host instead.\n      return (await this._backdrop()).click();\n    }\n  }\n\n  /** Gets the selector that should be used to find this select's panel. */\n  private async _getPanelSelector(): Promise<string> {\n    const id = await (await this.host()).getAttribute('id');\n    return `#${id}-panel`;\n  }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nimport {BaseHarnessFilters} from '@angular/cdk/testing';\n\n/** A set of criteria that can be used to filter a list of `MatSelectHarness` instances. */\nexport interface SelectHarnessFilters extends BaseHarnessFilters {}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './select-harness';\nexport * from './select-harness-filters';\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2015/select.js

@@ -1,6 +1,6 @@
 import { Overlay, CdkConnectedOverlay, OverlayModule } from '@angular/cdk/overlay';
 import { CommonModule } from '@angular/common';
-import { InjectionToken, Directive, EventEmitter, isDevMode, Component, ViewEncapsulation, ChangeDetectionStrategy, ChangeDetectorRef, NgZone, ElementRef, Optional, Inject, Self, Attribute, ViewChild, ContentChildren, Input, ContentChild, Output, NgModule } from '@angular/core';
+import { InjectionToken, Directive, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, ChangeDetectorRef, NgZone, ElementRef, Optional, Inject, Self, Attribute, ViewChild, ContentChildren, Input, ContentChild, Output, NgModule } from '@angular/core';
 import { mixinDisableRipple, mixinTabIndex, mixinDisabled, mixinErrorState, _countGroupLabelsBeforeOption, _getOptionScrollPosition, MAT_OPTION_PARENT_COMPONENT, ErrorStateMatcher, MatOption, MAT_OPTGROUP, MatOptionModule, MatCommonModule } from '@angular/material/core';
 import { MatFormFieldControl, MatFormField, MAT_FORM_FIELD, MatFormFieldModule } from '@angular/material/form-field';
 import { ViewportRuler, CdkScrollableModule } from '@angular/cdk/scrolling';
@@ -8,7 +8,7 @@ import { ActiveDescendantKeyManager, LiveAnnouncer } from '@angular/cdk/a11y';
 import { Directionality } from '@angular/cdk/bidi';
 import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
 import { SelectionModel } from '@angular/cdk/collections';
-import { DOWN_ARROW, UP_ARROW, LEFT_ARROW, RIGHT_ARROW, ENTER, SPACE, hasModifierKey, HOME, END, A } from '@angular/cdk/keycodes';
+import { DOWN_ARROW, UP_ARROW, LEFT_ARROW, RIGHT_ARROW, ENTER, SPACE, hasModifierKey, A } from '@angular/cdk/keycodes';
 import { NgForm, FormGroupDirective, NgControl } from '@angular/forms';
 import { Subject, defer, merge } from 'rxjs';
 import { startWith, switchMap, take, filter, map, distinctUntilChanged, takeUntil } from 'rxjs/operators';
@@ -213,6 +213,8 @@ class MatSelect extends _MatSelectMixinBase {
         this._compareWith = (o1, o2) => o1 === o2;
         /** Unique id for this input. */
         this._uid = `mat-select-${nextUniqueId++}`;
+        /** Current `ariar-labelledby` value for the select trigger. */
+        this._triggerAriaLabelledBy = null;
         /** Emits whenever the component is destroyed. */
         this._destroy = new Subject();
         /** The cached font-size of the trigger element. */
@@ -221,8 +223,7 @@ class MatSelect extends _MatSelectMixinBase {
         this._onChange = () => { };
         /** `View -> model callback called when select has been touched` */
         this._onTouched = () => { };
-        /** The IDs of child options to be passed to the aria-owns attribute. */
-        this._optionIds = '';
+        this._valueId = `mat-select-value-${nextUniqueId++}`;
         /** The value of the select panel's transform-origin property. */
         this._transformOrigin = 'top';
         /** Emits when the panel element is finished transforming in. */
@@ -267,7 +268,6 @@ class MatSelect extends _MatSelectMixinBase {
                 return options.changes.pipe(startWith(options), switchMap(() => merge(...options.map(option => option.onSelectionChange))));
             }
             return this._ngZone.onStable
-                .asObservable()
                 .pipe(take(1), switchMap(() => this.optionSelectionChanges));
         });
         /** Event emitted when the select panel has been toggled. */
@@ -322,7 +322,7 @@ class MatSelect extends _MatSelectMixinBase {
     /** Whether the user should be allowed to select multiple options. */
     get multiple() { return this._multiple; }
     set multiple(value) {
-        if (this._selectionModel) {
+        if (this._selectionModel && (typeof ngDevMode === 'undefined' || ngDevMode)) {
             throw getMatSelectDynamicMultipleError();
         }
         this._multiple = coerceBooleanProperty(value);
@@ -339,7 +339,7 @@ class MatSelect extends _MatSelectMixinBase {
      */
     get compareWith() { return this._compareWith; }
     set compareWith(fn) {
-        if (typeof fn !== 'function') {
+        if (typeof fn !== 'function' && (typeof ngDevMode === 'undefined' || ngDevMode)) {
             throw getMatSelectNonFunctionValueError();
         }
         this._compareWith = fn;
@@ -352,7 +352,9 @@ class MatSelect extends _MatSelectMixinBase {
     get value() { return this._value; }
     set value(newValue) {
         if (newValue !== this._value) {
-            this.writeValue(newValue);
+            if (this.options) {
+                this._setSelectionByValue(newValue);
+            }
             this._value = newValue;
         }
     }
@@ -407,6 +409,20 @@ class MatSelect extends _MatSelectMixinBase {
         });
     }
     ngDoCheck() {
+        const newAriaLabelledby = this._getTriggerAriaLabelledby();
+        // We have to manage setting the `aria-labelledby` ourselves, because part of its value
+        // is computed as a result of a content query which can cause this binding to trigger a
+        // "changed after checked" error.
+        if (newAriaLabelledby !== this._triggerAriaLabelledBy) {
+            const element = this._elementRef.nativeElement;
+            this._triggerAriaLabelledBy = newAriaLabelledby;
+            if (newAriaLabelledby) {
+                element.setAttribute('aria-labelledby', newAriaLabelledby);
+            }
+            else {
+                element.removeAttribute('aria-labelledby');
+            }
+        }
         if (this.ngControl) {
             this.updateErrorState();
         }
@@ -445,7 +461,7 @@ class MatSelect extends _MatSelectMixinBase {
         this._highlightCorrectOption();
         this._changeDetectorRef.markForCheck();
         // Set the font size on the panel element once it exists.
-        this._ngZone.onStable.asObservable().pipe(take(1)).subscribe(() => {
+        this._ngZone.onStable.pipe(take(1)).subscribe(() => {
             if (this._triggerFontSize && this.overlayDir.overlayRef &&
                 this.overlayDir.overlayRef.overlayElement) {
                 this.overlayDir.overlayRef.overlayElement.style.fontSize = `${this._triggerFontSize}px`;
@@ -468,9 +484,7 @@ class MatSelect extends _MatSelectMixinBase {
      * @param value New value to be written to the model.
      */
     writeValue(value) {
-        if (this.options) {
-            this._setSelectionByValue(value);
-        }
+        this.value = value;
     }
     /**
      * Saves a callback function to be invoked when the select's value
@@ -551,13 +565,7 @@ class MatSelect extends _MatSelectMixinBase {
         }
         else if (!this.multiple) {
             const previouslySelectedOption = this.selected;
-            if (keyCode === HOME || keyCode === END) {
-                keyCode === HOME ? manager.setFirstItemActive() : manager.setLastItemActive();
-                event.preventDefault();
-            }
-            else {
-                manager.onKeydown(event);
-            }
+            manager.onKeydown(event);
             const selectedOption = this.selected;
             // Since the value has changed, we need to announce it ourselves.
             if (selectedOption && previouslySelectedOption !== selectedOption) {
@@ -573,11 +581,7 @@ class MatSelect extends _MatSelectMixinBase {
         const keyCode = event.keyCode;
         const isArrowKey = keyCode === DOWN_ARROW || keyCode === UP_ARROW;
         const isTyping = manager.isTyping();
-        if (keyCode === HOME || keyCode === END) {
-            event.preventDefault();
-            keyCode === HOME ? manager.setFirstItemActive() : manager.setLastItemActive();
-        }
-        else if (isArrowKey && event.altKey) {
+        if (isArrowKey && event.altKey) {
             // Close the select on ALT + arrow key to match the native <select>
             event.preventDefault();
             this.close();
@@ -657,7 +661,7 @@ class MatSelect extends _MatSelectMixinBase {
      */
     _setSelectionByValue(value) {
         if (this.multiple && value) {
-            if (!Array.isArray(value)) {
+            if (!Array.isArray(value) && (typeof ngDevMode === 'undefined' || ngDevMode)) {
                 throw getMatSelectNonArrayValueError();
             }
             this._selectionModel.clear();
@@ -691,7 +695,7 @@ class MatSelect extends _MatSelectMixinBase {
                 return option.value != null && this._compareWith(option.value, value);
             }
             catch (error) {
-                if (isDevMode()) {
+                if (typeof ngDevMode === 'undefined' || ngDevMode) {
                     // Notify developers of errors in their comparator.
                     console.warn(error);
                 }
@@ -709,6 +713,7 @@ class MatSelect extends _MatSelectMixinBase {
             .withTypeAhead(this._typeaheadDebounceInterval)
             .withVerticalOrientation()
             .withHorizontalOrientation(this._isRtl() ? 'rtl' : 'ltr')
+            .withHomeAndEnd()
             .withAllowedModifierKeys(['shiftKey']);
         this._keyManager.tabOut.pipe(takeUntil(this._destroy)).subscribe(() => {
             if (this.panelOpen) {
@@ -750,7 +755,6 @@ class MatSelect extends _MatSelectMixinBase {
             this._changeDetectorRef.markForCheck();
             this.stateChanges.next();
         });
-        this._setOptionIds();
     }
     /** Invoked when an option is clicked. */
     _onSelect(option, isUserInput) {
@@ -758,7 +762,9 @@ class MatSelect extends _MatSelectMixinBase {
         if (option.value == null && !this._multiple) {
             option.deselect();
             this._selectionModel.clear();
-            this._propagateChanges(option.value);
+            if (this.value != null) {
+                this._propagateChanges(option.value);
+            }
         }
         else {
             if (wasSelected !== option.selected) {
@@ -810,10 +816,6 @@ class MatSelect extends _MatSelectMixinBase {
         this.selectionChange.emit(new MatSelectChange(this, valueToEmit));
         this._changeDetectorRef.markForCheck();
     }
-    /** Records option IDs to pass to the aria-owns property. */
-    _setOptionIds() {
-        this._optionIds = this.options.map(option => option.id).join(' ');
-    }
     /**
      * Highlights the selected item. If no option is selected, it will highlight
      * the first item instead.
@@ -832,7 +834,8 @@ class MatSelect extends _MatSelectMixinBase {
     _scrollActiveOptionIntoView() {
         const activeOptionIndex = this._keyManager.activeItemIndex || 0;
         const labelCount = _countGroupLabelsBeforeOption(activeOptionIndex, this.options, this.optionGroups);
-        this.panel.nativeElement.scrollTop = _getOptionScrollPosition(activeOptionIndex + labelCount, this._getItemHeight(), this.panel.nativeElement.scrollTop, SELECT_PANEL_MAX_HEIGHT);
+        const itemHeight = this._getItemHeight();
+        this.panel.nativeElement.scrollTop = _getOptionScrollPosition((activeOptionIndex + labelCount) * itemHeight, itemHeight, this.panel.nativeElement.scrollTop, SELECT_PANEL_MAX_HEIGHT);
     }
     /** Focuses the select element. */
     focus(options) {
@@ -883,24 +886,13 @@ class MatSelect extends _MatSelectMixinBase {
         const optimalScrollPosition = optionOffsetFromScrollTop - scrollBuffer + halfOptionHeight;
         return Math.min(Math.max(0, optimalScrollPosition), maxScroll);
     }
-    /** Returns the aria-label of the select component. */
-    _getAriaLabel() {
-        // If an ariaLabelledby value has been set by the consumer, the select should not overwrite the
-        // `aria-labelledby` value by setting the ariaLabel to the placeholder.
-        return this.ariaLabelledby ? null : this.ariaLabel || this.placeholder;
-    }
-    /** Returns the aria-labelledby of the select component. */
-    _getAriaLabelledby() {
-        if (this.ariaLabelledby) {
-            return this.ariaLabelledby;
-        }
-        // Note: we use `_getAriaLabel` here, because we want to check whether there's a
-        // computed label. `this.ariaLabel` is only the user-specified label.
-        if (!this._parentFormField || !this._parentFormField._hasFloatingLabel() ||
-            this._getAriaLabel()) {
+    /** Gets the aria-labelledby for the select panel. */
+    _getPanelAriaLabelledby() {
+        if (this.ariaLabel) {
             return null;
         }
-        return this._parentFormField._labelId || null;
+        const labelId = this._getLabelId();
+        return this.ariaLabelledby ? labelId + ' ' + this.ariaLabelledby : labelId;
     }
     /** Determines the `aria-activedescendant` to be set on the host. */
     _getAriaActiveDescendant() {
@@ -909,6 +901,11 @@ class MatSelect extends _MatSelectMixinBase {
         }
         return null;
     }
+    /** Gets the ID of the element that is labelling the select. */
+    _getLabelId() {
+        var _a;
+        return ((_a = this._parentFormField) === null || _a === void 0 ? void 0 : _a.getLabelId()) || '';
+    }
     /**
      * Sets the x-offset of the overlay panel in relation to the trigger's top start corner.
      * This must be adjusted to align the selected option text over the trigger text when
@@ -1068,6 +1065,17 @@ class MatSelect extends _MatSelectMixinBase {
     _getItemHeight() {
         return this._triggerFontSize * SELECT_ITEM_HEIGHT_EM;
     }
+    /** Gets the aria-labelledby of the select component trigger. */
+    _getTriggerAriaLabelledby() {
+        if (this.ariaLabel) {
+            return null;
+        }
+        let value = this._getLabelId() + ' ' + this._valueId;
+        if (this.ariaLabelledby) {
+            value += ' ' + this.ariaLabelledby;
+        }
+        return value;
+    }
     /**
      * Implemented as part of MatFormFieldControl.
      * @docs-private
@@ -1095,28 +1103,34 @@ MatSelect.decorators = [
     { type: Component, args: [{
                 selector: 'mat-select',
                 exportAs: 'matSelect',
-                template: "<div cdk-overlay-origin\n     class=\"mat-select-trigger\"\n     aria-hidden=\"true\"\n     (click)=\"toggle()\"\n     #origin=\"cdkOverlayOrigin\"\n     #trigger>\n  <div class=\"mat-select-value\" [ngSwitch]=\"empty\">\n    <span class=\"mat-select-placeholder\" *ngSwitchCase=\"true\">{{placeholder || '\\u00A0'}}</span>\n    <span class=\"mat-select-value-text\" *ngSwitchCase=\"false\" [ngSwitch]=\"!!customTrigger\">\n      <span *ngSwitchDefault>{{triggerValue || '\\u00A0'}}</span>\n      <ng-content select=\"mat-select-trigger\" *ngSwitchCase=\"true\"></ng-content>\n    </span>\n  </div>\n\n  <div class=\"mat-select-arrow-wrapper\"><div class=\"mat-select-arrow\"></div></div>\n</div>\n\n<ng-template\n  cdk-connected-overlay\n  cdkConnectedOverlayLockPosition\n  cdkConnectedOverlayHasBackdrop\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  [cdkConnectedOverlayScrollStrategy]=\"_scrollStrategy\"\n  [cdkConnectedOverlayOrigin]=\"origin\"\n  [cdkConnectedOverlayOpen]=\"panelOpen\"\n  [cdkConnectedOverlayPositions]=\"_positions\"\n  [cdkConnectedOverlayMinWidth]=\"_triggerRect?.width\"\n  [cdkConnectedOverlayOffsetY]=\"_offsetY\"\n  (backdropClick)=\"close()\"\n  (attach)=\"_onAttached()\"\n  (detach)=\"close()\">\n  <div class=\"mat-select-panel-wrap\" [@transformPanelWrap]>\n    <div\n      #panel\n      [attr.id]=\"id + '-panel'\"\n      class=\"mat-select-panel {{ _getPanelTheme() }}\"\n      [ngClass]=\"panelClass\"\n      [@transformPanel]=\"multiple ? 'showing-multiple' : 'showing'\"\n      (@transformPanel.done)=\"_panelDoneAnimatingStream.next($event.toState)\"\n      [style.transformOrigin]=\"_transformOrigin\"\n      [style.font-size.px]=\"_triggerFontSize\"\n      (keydown)=\"_handleKeydown($event)\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n",
+                template: "<div cdk-overlay-origin\n     class=\"mat-select-trigger\"\n     (click)=\"toggle()\"\n     #origin=\"cdkOverlayOrigin\"\n     #trigger>\n  <div class=\"mat-select-value\" [ngSwitch]=\"empty\" [attr.id]=\"_valueId\">\n    <span class=\"mat-select-placeholder\" *ngSwitchCase=\"true\">{{placeholder || '\\u00A0'}}</span>\n    <span class=\"mat-select-value-text\" *ngSwitchCase=\"false\" [ngSwitch]=\"!!customTrigger\">\n      <span *ngSwitchDefault>{{triggerValue || '\\u00A0'}}</span>\n      <ng-content select=\"mat-select-trigger\" *ngSwitchCase=\"true\"></ng-content>\n    </span>\n  </div>\n\n  <div class=\"mat-select-arrow-wrapper\"><div class=\"mat-select-arrow\"></div></div>\n</div>\n\n<ng-template\n  cdk-connected-overlay\n  cdkConnectedOverlayLockPosition\n  cdkConnectedOverlayHasBackdrop\n  cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n  [cdkConnectedOverlayScrollStrategy]=\"_scrollStrategy\"\n  [cdkConnectedOverlayOrigin]=\"origin\"\n  [cdkConnectedOverlayOpen]=\"panelOpen\"\n  [cdkConnectedOverlayPositions]=\"_positions\"\n  [cdkConnectedOverlayMinWidth]=\"_triggerRect?.width!\"\n  [cdkConnectedOverlayOffsetY]=\"_offsetY\"\n  (backdropClick)=\"close()\"\n  (attach)=\"_onAttached()\"\n  (detach)=\"close()\">\n  <div class=\"mat-select-panel-wrap\" [@transformPanelWrap]>\n    <div\n      #panel\n      role=\"listbox\"\n      tabindex=\"-1\"\n      class=\"mat-select-panel {{ _getPanelTheme() }}\"\n      [attr.id]=\"id + '-panel'\"\n      [attr.aria-multiselectable]=\"multiple\"\n      [attr.aria-label]=\"ariaLabel || null\"\n      [attr.aria-labelledby]=\"_getPanelAriaLabelledby()\"\n      [ngClass]=\"panelClass\"\n      [@transformPanel]=\"multiple ? 'showing-multiple' : 'showing'\"\n      (@transformPanel.done)=\"_panelDoneAnimatingStream.next($event.toState)\"\n      [style.transformOrigin]=\"_transformOrigin\"\n      [style.font-size.px]=\"_triggerFontSize\"\n      (keydown)=\"_handleKeydown($event)\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n",
                 inputs: ['disabled', 'disableRipple', 'tabIndex'],
                 encapsulation: ViewEncapsulation.None,
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 host: {
-                    'role': 'listbox',
+                    'role': 'combobox',
+                    'aria-autocomplete': 'none',
+                    // TODO(crisbeto): the value for aria-haspopup should be `listbox`, but currently it's difficult
+                    // to sync into g3, because of an outdated automated a11y check which flags it as an invalid
+                    // value. At some point we should try to switch it back to being `listbox`. When doing the
+                    // MDC-based `mat-select`, we can get away with starting it off as `listbox`.
+                    'aria-haspopup': 'true',
+                    'class': 'mat-select',
                     '[attr.id]': 'id',
                     '[attr.tabindex]': 'tabIndex',
-                    '[attr.aria-label]': '_getAriaLabel()',
-                    '[attr.aria-labelledby]': '_getAriaLabelledby()',
+                    '[attr.aria-controls]': 'panelOpen ? id + "-panel" : null',
+                    '[attr.aria-expanded]': 'panelOpen',
+                    '[attr.aria-label]': 'ariaLabel || null',
                     '[attr.aria-required]': 'required.toString()',
                     '[attr.aria-disabled]': 'disabled.toString()',
                     '[attr.aria-invalid]': 'errorState',
-                    '[attr.aria-owns]': 'panelOpen ? _optionIds : null',
-                    '[attr.aria-multiselectable]': 'multiple',
                     '[attr.aria-describedby]': '_ariaDescribedby || null',
                     '[attr.aria-activedescendant]': '_getAriaActiveDescendant()',
                     '[class.mat-select-disabled]': 'disabled',
                     '[class.mat-select-invalid]': 'errorState',
                     '[class.mat-select-required]': 'required',
                     '[class.mat-select-empty]': 'empty',
-                    'class': 'mat-select',
+                    '[class.mat-select-multiple]': 'multiple',
                     '(keydown)': '_handleKeydown($event)',
                     '(focus)': '_onFocus()',
                     '(blur)': '_onBlur()',