Skip to content

Commit b274a13

Browse files
authored
fix(buttons): adding missing type=button #13567 (#13573)
1 parent 3e527e5 commit b274a13

File tree

63 files changed

+263
-256
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

63 files changed

+263
-256
lines changed

projects/igniteui-angular/src/lib/action-strip/action-strip.component.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
<ng-content #content></ng-content>
33
<ng-container *ngIf="menuItems.length > 0">
44
<button
5+
type="button"
56
igxButton="icon"
67
igxRipple
78
[igxToggleAction]="dropdown"
Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
<ng-container *ngIf="!asMenuItem">
2-
<button [title]="labelText" igxButton="icon" igxRipple (click)="handleClick($event)" (mousedown)="preventEvent($event)">
2+
<button type="button" [title]="labelText" igxButton="icon" igxRipple (click)="handleClick($event)" (mousedown)="preventEvent($event)">
33
<igx-icon *ngIf="iconSet" [family]="iconSet" [name]="iconName">{{iconName}}</igx-icon>
44
<igx-icon *ngIf="!iconSet" >{{iconName}}</igx-icon>
55
</button>
66
</ng-container>
77

88
<ng-template #menuItemTemplate>
99
<ng-container *ngIf="asMenuItem">
10-
<div #container [className]='containerClass'>
10+
<div #container [className]="containerClass">
1111
<igx-icon *ngIf="iconSet" [family]="iconSet" [name]="iconName">{{iconName}}</igx-icon>
1212
<igx-icon *ngIf="!iconSet" >{{iconName}}</igx-icon>
1313
<label igxLabel>{{labelText}}</label>
1414
</div>
1515
</ng-container>
16-
</ng-template>
16+
</ng-template>

projects/igniteui-angular/src/lib/banner/banner.component.html

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,14 +11,14 @@
1111
</span>
1212
</div>
1313
<div class="igx-banner__actions">
14-
<ng-container *ngIf="useDefaultTemplate">
15-
<button igxButton="flat" igxRipple (click)="close()">
16-
{{ resourceStrings.igx_banner_button_dismiss }}
17-
</button>
18-
</ng-container>
19-
<ng-container *ngIf="!useDefaultTemplate">
20-
<ng-content select="igx-banner-actions"></ng-content>
21-
</ng-container>
14+
<ng-container *ngIf="useDefaultTemplate">
15+
<button type="button" igxButton="flat" igxRipple (click)="close()">
16+
{{ resourceStrings.igx_banner_button_dismiss }}
17+
</button>
18+
</ng-container>
19+
<ng-container *ngIf="!useDefaultTemplate">
20+
<ng-content select="igx-banner-actions"></ng-content>
21+
</ng-container>
2222
</div>
2323
</div>
2424
</igx-expansion-panel-body>

projects/igniteui-angular/src/lib/banner/banner.component.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,8 @@ export interface BannerCancelEventArgs extends BannerEventArgs, CancelableEventA
4444
* <igx-banner #banner>
4545
* Our privacy settings have changed.
4646
* <igx-banner-actions>
47-
* <button igxButton="raised">Read More</button>
48-
* <button igxButton="raised">Accept and Continue</button>
47+
* <button type="button" igxButton="raised">Read More</button>
48+
* <button type="button" igxButton="raised">Accept and Continue</button>
4949
* </igx-banner-actions>
5050
* </igx-banner>
5151
* ```
@@ -218,7 +218,7 @@ export class IgxBannerComponent implements IToggleView {
218218
* <igx-banner #banner>
219219
* ...
220220
* </igx-banner>
221-
* <button (click)="banner.open()">Open Banner</button>
221+
* <button type="button" (click)="banner.open()">Open Banner</button>
222222
* ```
223223
*/
224224
public open(event?: Event) {
@@ -247,7 +247,7 @@ export class IgxBannerComponent implements IToggleView {
247247
* <igx-banner #banner>
248248
* ...
249249
* </igx-banner>
250-
* <button (click)="banner.close()">Close Banner</button>
250+
* <button type="button" (click)="banner.close()">Close Banner</button>
251251
* ```
252252
*/
253253
public close(event?: Event) {
@@ -276,7 +276,7 @@ export class IgxBannerComponent implements IToggleView {
276276
* <igx-banner #banner>
277277
* ...
278278
* </igx-banner>
279-
* <button (click)="banner.toggle()">Toggle Banner</button>
279+
* <button type="button" (click)="banner.toggle()">Toggle Banner</button>
280280
* ```
281281
*/
282282
public toggle(event?: Event) {

projects/igniteui-angular/src/lib/card/README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,8 +28,8 @@ Supporting directives and components:
2828
</igx-card-content>
2929

3030
<igx-card-actions>
31-
<button igxButton (click)="openUrl('https://www.facebook.com/pages/Elon-Musk/108250442531979')">Like</button>
32-
<button igxButton (click)="openUrl('https://twitter.com/elonmusk')">Share</button>
31+
<button type="button" igxButton (click)="openUrl('https://www.facebook.com/pages/Elon-Musk/108250442531979')">Like</button>
32+
<button type="button" igxButton (click)="openUrl('https://twitter.com/elonmusk')">Share</button>
3333
</igx-card-actions>
3434
</igx-card>
3535
```

projects/igniteui-angular/src/lib/card/card.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -182,8 +182,8 @@ export class IgxCardFooterDirective {
182182
* <h5 igxCardHeaderSubtitle>{{subtitle}}</h5>
183183
* </igx-card-header>
184184
* <igx-card-actions>
185-
* <button igxButton igxRipple>Share</button>
186-
* <button igxButton igxRipple>Play Album</button>
185+
* <button type="button" igxButton igxRipple>Share</button>
186+
* <button type="button" igxButton igxRipple>Play Album</button>
187187
* </igx-card-actions>
188188
* </igx-card>
189189
* ```

projects/igniteui-angular/src/lib/carousel/README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ The **IgxCarousel** supports templating indicators and navigation buttons
6161
<igx-carousel #carousel>
6262
...
6363
<ng-template igxCarouselNextButton let-disabled>
64-
<button igxButton="fab" igxRipple="white" [disabled]="disabled">
64+
<button type="button" igxButton="fab" igxRipple="white" [disabled]="disabled">
6565
<igx-icon>add</igx-icon>
6666
</button>
6767
</ng-template>
@@ -73,7 +73,7 @@ The **IgxCarousel** supports templating indicators and navigation buttons
7373
<igx-carousel #carousel>
7474
...
7575
<ng-template igxCarouselPrevButton let-disabled>
76-
<button igxButton="fab" igxRipple="white" [disabled]="disabled">
76+
<button type="button" igxButton="fab" igxRipple="white" [disabled]="disabled">
7777
<igx-icon>remove</igx-icon>
7878
</button>
7979
</ng-template>

projects/igniteui-angular/src/lib/carousel/carousel.component.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -267,9 +267,9 @@ export class IgxCarouselComponent extends IgxCarouselComponentBase implements On
267267
* <igx-carousel #carousel>
268268
* ...
269269
* <ng-template igxCarouselNextButton let-disabled>
270-
* <button igxButton="fab" igxRipple="white" [disabled]="disabled">
271-
* <igx-icon>add</igx-icon>
272-
* </button>
270+
* <button type="button" igxButton="fab" igxRipple="white" [disabled]="disabled">
271+
* <igx-icon>add</igx-icon>
272+
* </button>
273273
* </ng-template>
274274
* </igx-carousel>
275275
* ```
@@ -290,9 +290,9 @@ export class IgxCarouselComponent extends IgxCarouselComponentBase implements On
290290
* <igx-carousel #carousel>
291291
* ...
292292
* <ng-template igxCarouselPrevButton let-disabled>
293-
* <button igxButton="fab" igxRipple="white" [disabled]="disabled">
294-
* <igx-icon>remove</igx-icon>
295-
* </button>
293+
* <button type="button" igxButton="fab" igxRipple="white" [disabled]="disabled">
294+
* <igx-icon>remove</igx-icon>
295+
* </button>
296296
* </ng-template>
297297
* </igx-carousel>
298298
* ```

projects/igniteui-angular/src/lib/combo/combo.common.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -650,7 +650,7 @@ export abstract class IgxComboBaseDirective extends DisplayDensityBase implement
650650
* <igx-combo #combo>
651651
* ...
652652
* <ng-template igxComboAddItem>
653-
* <button class="combo__add-button">
653+
* <button type="button" igxButton="raised" class="combo__add-button">
654654
* Click to add item
655655
* </button>
656656
* </ng-template>
@@ -1019,7 +1019,7 @@ export abstract class IgxComboBaseDirective extends DisplayDensityBase implement
10191019
* A method that opens/closes the combo.
10201020
*
10211021
* ```html
1022-
* <button (click)="combo.toggle()">Toggle Combo</button>
1022+
* <button type="button" (click)="combo.toggle()">Toggle Combo</button>
10231023
* <igx-combo #combo></igx-combo>
10241024
* ```
10251025
*/
@@ -1039,7 +1039,7 @@ export abstract class IgxComboBaseDirective extends DisplayDensityBase implement
10391039
* A method that opens the combo.
10401040
*
10411041
* ```html
1042-
* <button (click)="combo.open()">Open Combo</button>
1042+
* <button type="button" (click)="combo.open()">Open Combo</button>
10431043
* <igx-combo #combo></igx-combo>
10441044
* ```
10451045
*/
@@ -1057,7 +1057,7 @@ export abstract class IgxComboBaseDirective extends DisplayDensityBase implement
10571057
* A method that closes the combo.
10581058
*
10591059
* ```html
1060-
* <button (click)="combo.close()">Close Combo</button>
1060+
* <button type="button" (click)="combo.close()">Close Combo</button>
10611061
* <igx-combo #combo></igx-combo>
10621062
* ```
10631063
*/

projects/igniteui-angular/src/lib/combo/combo.component.html

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@
1111
<input igxInput #comboInput name="comboInput" type="text" [value]="value" readonly
1212
[attr.placeholder]="placeholder" [disabled]="disabled"
1313
role="combobox" aria-haspopup="listbox"
14-
[attr.aria-expanded]="!this.dropdown.collapsed" [attr.aria-controls]="this.dropdown.listId"
15-
[attr.aria-labelledby]="this.ariaLabelledBy || this.label?.id || this.placeholder"
14+
[attr.aria-expanded]="!dropdown.collapsed" [attr.aria-controls]="dropdown.listId"
15+
[attr.aria-labelledby]="ariaLabelledBy || label?.id || placeholder"
1616
(blur)="onBlur()" />
1717
<ng-container ngProjectAs="igx-suffix">
1818
<ng-content select="igx-suffix"></ng-content>
@@ -28,15 +28,15 @@
2828
</igx-suffix>
2929
<igx-suffix class="igx-combo__toggle-button">
3030
<ng-container *ngIf="toggleIconTemplate">
31-
<ng-container *ngTemplateOutlet="toggleIconTemplate; context: {$implicit: this.collapsed}"></ng-container>
31+
<ng-container *ngTemplateOutlet="toggleIconTemplate; context: {$implicit: collapsed}"></ng-container>
3232
</ng-container>
3333
<igx-icon *ngIf="!toggleIconTemplate">
3434
{{ toggleIcon }}
3535
</igx-icon>
3636
</igx-suffix>
3737
</igx-input-group>
3838
<igx-combo-drop-down #igxComboDropDown class="igx-combo__drop-down" [displayDensity]="displayDensity"
39-
[labelledBy]="this.ariaLabelledBy || this.label?.id || this.placeholder || ''"
39+
[labelledBy]="ariaLabelledBy || label?.id || placeholder || ''"
4040
[width]="itemsWidth || '100%'" (opening)="handleOpening($event)" (closing)="handleClosing($event)"
4141
(opened)="handleOpened()" (closed)="handleClosed()">
4242
<div class="igx-combo__search">
@@ -57,8 +57,8 @@
5757
<div #dropdownItemContainer class="igx-combo__content" [style.overflow]="'hidden'"
5858
[style.maxHeight.rem]="itemsMaxHeightInRem" [igxDropDownItemNavigation]="dropdown" (focus)="dropdown.onFocus()"
5959
[tabindex]="dropdown.collapsed ? -1 : 0" [attr.id]="dropdown.id" aria-multiselectable="true"
60-
[attr.aria-activedescendant]="this.activeDescendant">
61-
<igx-combo-item [itemHeight]='itemHeight' *igxFor="let item of data
60+
[attr.aria-activedescendant]="activeDescendant">
61+
<igx-combo-item [itemHeight]="itemHeight" *igxFor="let item of data
6262
| comboFiltering:filterValue:displayKey:filteringOptions:filterFunction
6363
| comboGrouping:groupKey:valueKey:groupSortingDirection;
6464
index as rowIndex; containerSize: itemsMaxHeight; scrollOrientation: 'vertical'; itemSize: itemHeight"
@@ -102,7 +102,7 @@
102102
<span>{{resourceStrings.igx_combo_empty_message}}</span>
103103
</ng-template>
104104
<ng-template #addItemDefault let-control>
105-
<button igxButton="flat" igxRipple>Add item</button>
105+
<button type="button" igxButton="flat" igxRipple>Add item</button>
106106
</ng-template>
107107
<ng-template #headerItemBase let-item let-key="valueKey" let-groupKey="groupKey">
108108
{{ item[key] }}

0 commit comments

Comments
 (0)