Revert "ACS-8106: (a11y) Replace Material Tooltip with standard tooltip (#9894)" (#9905)

This reverts commit f3a94bdfa4.
This commit is contained in:
Pablo Martinez
2024-07-03 14:08:21 +02:00
committed by GitHub
parent e457dd3a78
commit 41c3667906
96 changed files with 561 additions and 254 deletions

View File

@@ -20,7 +20,7 @@
<mat-icon>refresh</mat-icon>
</button>
</div>
<span *ngIf="isTitleEnabled()" class="adf-form-title" [title]="form.taskName">
<span *ngIf="isTitleEnabled()" class="adf-form-title" [matTooltip]="form.taskName">
{{form.taskName}}
<ng-container *ngIf="!form.taskName">
{{'FORM.FORM_RENDERER.NAMELESS_TASK' | translate}}

View File

@@ -45,12 +45,13 @@ import { CommonModule } from '@angular/common';
import { MatCardModule } from '@angular/material/card';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core';
@Component({
selector: 'adf-form',
standalone: true,
imports: [CommonModule, MatCardModule, MatButtonModule, MatIconModule, TranslateModule, FormRendererComponent, FormatSpacePipe],
imports: [CommonModule, MatCardModule, MatButtonModule, MatIconModule, MatTooltipModule, TranslateModule, FormRendererComponent, FormatSpacePipe],
templateUrl: './form.component.html',
encapsulation: ViewEncapsulation.None
})

View File

@@ -72,7 +72,7 @@
matLine
id="{{ 'file-' + file.id }}"
(click)="onAttachFileClicked(file)"
[title]="file.name"
[matTooltip]="file.name"
(keyup.enter)="onAttachFileClicked(file)"
tabindex="0"
role="button"

View File

@@ -33,11 +33,12 @@ import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
import { MatMenuModule } from '@angular/material/menu';
import { MatListModule } from '@angular/material/list';
import { MatTooltipModule } from '@angular/material/tooltip';
@Component({
selector: 'attach-widget',
standalone: true,
imports: [CommonModule, TranslateModule, MatIconModule, MatButtonModule, MatMenuModule, MatListModule, ErrorWidgetComponent],
imports: [CommonModule, TranslateModule, MatIconModule, MatButtonModule, MatMenuModule, MatListModule, MatTooltipModule, ErrorWidgetComponent],
templateUrl: './attach-file-widget.component.html',
styleUrls: ['./attach-file-widget.component.scss'],
host: {

View File

@@ -14,7 +14,9 @@
[placeholder]="field.placeholder"
[matAutocomplete]="auto"
(blur)="markAsTouched()"
[title]="field.tooltip">
[matTooltip]="field.tooltip"
matTooltipPosition="above"
matTooltipShowDelay="1000">
<mat-autocomplete class="adf-people-widget-list"
#auto="matAutocomplete"
(optionSelected)="onItemSelect($event.option.value)"

View File

@@ -293,7 +293,7 @@ describe('PeopleWidgetComponent', () => {
await fixture.whenStable();
const radioButtonsElement: any = element.querySelector('#people-id');
const tooltip = radioButtonsElement.getAttribute('title');
const tooltip = radioButtonsElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
});

View File

@@ -29,6 +29,7 @@ import { TranslateModule } from '@ngx-translate/core';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatTooltipModule } from '@angular/material/tooltip';
@Component({
selector: 'people-widget',
@@ -40,6 +41,7 @@ import { MatAutocompleteModule } from '@angular/material/autocomplete';
MatInputModule,
ReactiveFormsModule,
MatAutocompleteModule,
MatTooltipModule,
InitialUsernamePipe,
ErrorWidgetComponent
],

View File

@@ -4,7 +4,9 @@
<label class="adf-label" [attr.for]="field.id">{{field.name | translate }}<span class="adf-asterisk" *ngIf="isRequired()">*</span></label>
<mat-radio-group class="adf-radio-group" [(ngModel)]="field.value" [disabled]="field.readOnly">
<mat-radio-button
[title]="field.tooltip"
[matTooltip]="field.tooltip"
matTooltipPosition="above"
matTooltipShowDelay="1000"
[id]="field.id + '-' + opt.id"
[name]="field.id"
[value]="opt.id"

View File

@@ -27,6 +27,7 @@ import { ProcessDefinitionService } from '../../services/process-definition.serv
import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MatRadioButtonHarness, MatRadioGroupHarness } from '@angular/material/radio/testing';
import { MatTooltipHarness } from '@angular/material/tooltip/testing';
describe('RadioButtonsWidgetComponent', () => {
let formService: FormService;
@@ -241,9 +242,9 @@ describe('RadioButtonsWidgetComponent', () => {
fixture.detectChanges();
const option = await loader.getHarness(MatRadioButtonHarness.with({ selector: '#radio-id-opt-1' }));
const tooltip = await (await option.host()).getAttribute('title');
expect(tooltip).toEqual(radioButtonWidget.field.tooltip);
const tooltip = await loader.getHarness(MatTooltipHarness.with({ selector: '#radio-id-opt-1' }));
await tooltip.show();
expect(await tooltip.getTooltipText()).toEqual(radioButtonWidget.field.tooltip);
});
describe('and radioButton is populated via taskId', () => {

View File

@@ -25,11 +25,12 @@ import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { MatRadioModule } from '@angular/material/radio';
import { FormsModule } from '@angular/forms';
import { MatTooltipModule } from '@angular/material/tooltip';
@Component({
selector: 'radio-buttons-widget',
standalone: true,
imports: [CommonModule, TranslateModule, MatRadioModule, FormsModule, ErrorWidgetComponent],
imports: [CommonModule, TranslateModule, MatRadioModule, FormsModule, MatTooltipModule, ErrorWidgetComponent],
templateUrl: './radio-buttons.widget.html',
styleUrls: ['./radio-buttons.widget.scss'],
host: {

View File

@@ -5,7 +5,7 @@
</mat-chip-list>
<button mat-icon-button *ngIf="!readOnly" title="Add a checklist"
<button mat-icon-button *ngIf="!readOnly" matTooltip="Add a checklist" [matTooltipPosition]="'before'"
id="add-checklist" class="adf-add-to-checklist-button" (click)="showDialog()">
<mat-icon>add</mat-icon>
</button>

View File

@@ -23,6 +23,7 @@ import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { MatChipsModule } from '@angular/material/chips';
import { MatButtonModule } from '@angular/material/button';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatIconModule } from '@angular/material/icon';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
@@ -36,6 +37,7 @@ import { FormsModule } from '@angular/forms';
TranslateModule,
MatChipsModule,
MatButtonModule,
MatTooltipModule,
MatIconModule,
MatDialogModule,
MatFormFieldModule,