Skip to content

Commit defd48d

Browse files
esprehncrisbeto
authored andcommitted
rafactor(material/button): minor optimizations to button-base (#27949)
Use vararg version of classList.add which has been allowed since cac8359 also don't use a loop to check the attribute, it's only ever a single thing. (cherry picked from commit f8c6b40)
1 parent c6fa905 commit defd48d

File tree

1 file changed

+13
-19
lines changed

1 file changed

+13
-19
lines changed

src/material/button/button-base.ts

Lines changed: 13 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -37,33 +37,33 @@ export const MAT_BUTTON_HOST = {
3737
};
3838

3939
/** List of classes to add to buttons instances based on host attribute selector. */
40-
const HOST_SELECTOR_MDC_CLASS_PAIR: {selector: string; mdcClasses: string[]}[] = [
40+
const HOST_SELECTOR_MDC_CLASS_PAIR: {attribute: string; mdcClasses: string[]}[] = [
4141
{
42-
selector: 'mat-button',
42+
attribute: 'mat-button',
4343
mdcClasses: ['mdc-button', 'mat-mdc-button'],
4444
},
4545
{
46-
selector: 'mat-flat-button',
46+
attribute: 'mat-flat-button',
4747
mdcClasses: ['mdc-button', 'mdc-button--unelevated', 'mat-mdc-unelevated-button'],
4848
},
4949
{
50-
selector: 'mat-raised-button',
50+
attribute: 'mat-raised-button',
5151
mdcClasses: ['mdc-button', 'mdc-button--raised', 'mat-mdc-raised-button'],
5252
},
5353
{
54-
selector: 'mat-stroked-button',
54+
attribute: 'mat-stroked-button',
5555
mdcClasses: ['mdc-button', 'mdc-button--outlined', 'mat-mdc-outlined-button'],
5656
},
5757
{
58-
selector: 'mat-fab',
58+
attribute: 'mat-fab',
5959
mdcClasses: ['mdc-fab', 'mat-mdc-fab'],
6060
},
6161
{
62-
selector: 'mat-mini-fab',
62+
attribute: 'mat-mini-fab',
6363
mdcClasses: ['mdc-fab', 'mdc-fab--mini', 'mat-mdc-mini-fab'],
6464
},
6565
{
66-
selector: 'mat-icon-button',
66+
attribute: 'mat-icon-button',
6767
mdcClasses: ['mdc-icon-button', 'mat-mdc-icon-button'],
6868
},
6969
];
@@ -128,15 +128,14 @@ export class MatButtonBase implements AfterViewInit, OnDestroy {
128128
className: 'mat-mdc-button-ripple',
129129
});
130130

131-
const classList = (_elementRef.nativeElement as HTMLElement).classList;
131+
const element = this._elementRef.nativeElement;
132+
const classList = (element as HTMLElement).classList;
132133

133134
// For each of the variant selectors that is present in the button's host
134135
// attributes, add the correct corresponding MDC classes.
135-
for (const pair of HOST_SELECTOR_MDC_CLASS_PAIR) {
136-
if (this._hasHostAttributes(pair.selector)) {
137-
pair.mdcClasses.forEach((className: string) => {
138-
classList.add(className);
139-
});
136+
for (const {attribute, mdcClasses} of HOST_SELECTOR_MDC_CLASS_PAIR) {
137+
if (element.hasAttribute(attribute)) {
138+
classList.add(...mdcClasses);
140139
}
141140
}
142141
}
@@ -158,11 +157,6 @@ export class MatButtonBase implements AfterViewInit, OnDestroy {
158157
}
159158
}
160159

161-
/** Gets whether the button has one of the given attributes. */
162-
private _hasHostAttributes(...attributes: string[]) {
163-
return attributes.some(attribute => this._elementRef.nativeElement.hasAttribute(attribute));
164-
}
165-
166160
private _updateRippleDisabled(): void {
167161
this._rippleLoader?.setDisabled(
168162
this._elementRef.nativeElement,

0 commit comments

Comments
 (0)