From f3a94bdfa44108082089ed21f79e3a466359344b Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Tue, 2 Jul 2024 13:51:40 -0400 Subject: [PATCH] ACS-8106: (a11y) Replace Material Tooltip with standard tooltip (#9894) --- .../search/search-filter-chips.component.html | 2 +- .../page-object/components/material/index.ts | 1 - .../components/material/material-locators.ts | 9 +-- .../material/validation.component.ts | 29 -------- .../components/group.component.ts | 5 +- .../components/people.component.ts | 4 +- .../specs/groups-cloud.e2e.ts | 4 -- .../specs/people-cloud.e2e.ts | 1 - .../aspect-list/aspect-list.component.html | 2 +- .../src/lib/aspect-list/aspect-list.module.ts | 14 +--- .../content-node-selector.component.html | 2 +- .../content-node-selector.component.spec.ts | 8 +-- .../src/lib/dialogs/node-lock.dialog.html | 6 +- .../search-check-list.component.html | 4 +- ...rch-chip-autocomplete-input.component.html | 14 ++-- ...earch-chip-autocomplete-input.component.ts | 20 +++--- .../search-chip-list.component.html | 3 +- .../search-facet-field.component.html | 3 +- .../search-filter-menu-card.component.html | 3 +- .../search-filter-container.component.html | 2 +- .../search-filter.component.html | 5 +- .../search-radio/search-radio.component.html | 5 +- .../breadcrumb/breadcrumb.component.html | 3 +- .../breadcrumb/breadcrumb.component.ts | 34 +++++---- .../lib/components/flags/flags.component.html | 2 +- .../lib/components/flags/flags.component.ts | 2 - .../src/lib/card-view/card-view.module.ts | 4 +- .../card-view-dateitem.component.html | 3 +- .../card-view-textitem.component.html | 5 +- .../context-menu-list.component.html | 2 +- .../context-menu-list.component.ts | 3 +- .../src/lib/context-menu/context-menu.spec.ts | 23 ------ .../datatable/datatable.component.html | 4 +- .../middlewares/decimal-middleware.service.ts | 9 +-- .../widgets/amount/amount.widget.html | 4 +- .../widgets/amount/amount.widget.spec.ts | 14 +--- .../widgets/amount/amount.widget.ts | 3 +- .../widgets/checkbox/checkbox.widget.html | 6 +- .../widgets/checkbox/checkbox.widget.spec.ts | 17 +---- .../widgets/checkbox/checkbox.widget.ts | 3 +- .../widgets/date-time/date-time.widget.html | 4 +- .../date-time/date-time.widget.spec.ts | 17 +---- .../widgets/date-time/date-time.widget.ts | 12 +--- .../widgets/decimal/decimal.component.html | 6 +- .../widgets/decimal/decimal.component.spec.ts | 14 +--- .../widgets/decimal/decimal.component.ts | 3 +- .../display-text/display-text.widget.html | 5 +- .../display-text/display-text.widget.ts | 3 +- .../widgets/hyperlink/hyperlink.widget.html | 4 +- .../hyperlink/hyperlink.widget.spec.ts | 5 +- .../widgets/hyperlink/hyperlink.widget.ts | 3 +- .../multiline-text/multiline-text.widget.html | 6 +- .../multiline-text.widget.spec.ts | 14 +--- .../multiline-text/multiline-text.widget.ts | 3 +- .../widgets/number/number.widget.html | 6 +- .../widgets/number/number.widget.spec.ts | 14 +--- .../widgets/number/number.widget.ts | 3 +- .../components/widgets/text/text.widget.html | 6 +- .../widgets/text/text.widget.spec.ts | 14 +--- .../components/widgets/text/text.widget.ts | 3 +- lib/core/src/lib/material.module.ts | 71 +++++++++++++++---- .../notification-history.component.html | 3 +- .../notification-history.component.ts | 2 - .../analytics-generator.component.html | 2 +- .../analytics-generator.component.ts | 2 - .../form/components/form-cloud.component.html | 8 +-- .../attach-file-cloud-widget.component.html | 4 +- ...attach-file-cloud-widget.component.spec.ts | 38 ---------- .../attach-file/upload-cloud.widget.html | 3 +- .../widgets/date/date-cloud.widget.html | 4 +- .../widgets/date/date-cloud.widget.spec.ts | 34 --------- .../dropdown/dropdown-cloud.widget.html | 4 +- .../dropdown/dropdown-cloud.widget.spec.ts | 33 --------- .../widgets/group/group-cloud.widget.html | 4 +- .../widgets/group/group-cloud.widget.spec.ts | 24 ++----- .../widgets/people/people-cloud.widget.html | 4 +- .../people/people-cloud.widget.spec.ts | 20 +----- .../radio-buttons-cloud.widget.html | 4 +- .../radio-buttons-cloud.widget.spec.ts | 16 +---- .../components/group-cloud.component.html | 2 +- .../src/lib/material.module.ts | 59 +++++++++++---- .../components/people-cloud.component.html | 2 +- .../edit-process-filter-cloud.component.html | 2 +- ...base-edit-task-filter-cloud.component.html | 2 +- .../src/lib/form/form.component.html | 2 +- .../src/lib/form/form.component.ts | 3 +- .../attach-file-widget.component.html | 2 +- .../attach-file-widget.component.ts | 3 +- .../form/widgets/people/people.widget.html | 4 +- .../form/widgets/people/people.widget.spec.ts | 2 +- .../lib/form/widgets/people/people.widget.ts | 2 - .../radio-buttons/radio-buttons.widget.html | 4 +- .../radio-buttons.widget.spec.ts | 7 +- .../radio-buttons/radio-buttons.widget.ts | 3 +- .../checklist/checklist.component.html | 2 +- .../checklist/checklist.component.ts | 2 - 96 files changed, 254 insertions(+), 561 deletions(-) delete mode 100644 e2e-playwright/page-object/components/material/validation.component.ts diff --git a/demo-shell/src/app/components/search/search-filter-chips.component.html b/demo-shell/src/app/components/search/search-filter-chips.component.html index 9b5de08a00..2b5c03c8b5 100644 --- a/demo-shell/src/app/components/search/search-filter-chips.component.html +++ b/demo-shell/src/app/components/search/search-filter-chips.component.html @@ -12,7 +12,7 @@ - refresh + refresh diff --git a/e2e-playwright/page-object/components/material/index.ts b/e2e-playwright/page-object/components/material/index.ts index e80ddb3820..f3f96ee95e 100644 --- a/e2e-playwright/page-object/components/material/index.ts +++ b/e2e-playwright/page-object/components/material/index.ts @@ -16,4 +16,3 @@ */ export * from './error.component'; -export * from './validation.component'; diff --git a/e2e-playwright/page-object/components/material/material-locators.ts b/e2e-playwright/page-object/components/material/material-locators.ts index fc68a6868f..87d3af572c 100644 --- a/e2e-playwright/page-object/components/material/material-locators.ts +++ b/e2e-playwright/page-object/components/material/material-locators.ts @@ -16,10 +16,7 @@ */ export const materialLocators = { - Error: { - root: 'mat-error' - }, - Tooltip: { - root: 'mat-tooltip-component' - } + Error: { + root: 'mat-error' + } }; diff --git a/e2e-playwright/page-object/components/material/validation.component.ts b/e2e-playwright/page-object/components/material/validation.component.ts deleted file mode 100644 index 347ddb93a8..0000000000 --- a/e2e-playwright/page-object/components/material/validation.component.ts +++ /dev/null @@ -1,29 +0,0 @@ -/*! - * @license - * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { Page } from '@playwright/test'; -import { BaseComponent } from '../base.component'; -import { materialLocators } from './material-locators'; - -export class TooltipComponent extends BaseComponent { - private static rootElement = materialLocators.Tooltip.root; - public content = this.getChild('div'); - - constructor(page: Page) { - super(page, TooltipComponent.rootElement); - } -} diff --git a/e2e-playwright/process-services-cloud/components/group.component.ts b/e2e-playwright/process-services-cloud/components/group.component.ts index 0834dc080d..658c3891b8 100644 --- a/e2e-playwright/process-services-cloud/components/group.component.ts +++ b/e2e-playwright/process-services-cloud/components/group.component.ts @@ -17,13 +17,11 @@ import { Page } from '@playwright/test'; import { BaseComponent } from '../../page-object/components/base.component'; -import { ErrorComponent, TooltipComponent, ListboxComponent } from '../../page-object/components'; +import { ErrorComponent } from '../../page-object/components'; export class GroupComponent extends BaseComponent { private static rootElement = 'adf-cloud-group'; public error = new ErrorComponent(this.page); - public tooltip = new TooltipComponent(this.page); - public listbox = new ListboxComponent(this.page); public groupNaming = this.getChild('[data-automation-id="adf-cloud-group-chip-list"]'); public groupInput = this.getChild('[data-automation-id="adf-group-cloud-search-input"]'); @@ -33,5 +31,4 @@ export class GroupComponent extends BaseComponent { } public getUserLocator = (userName: string) => this.getChild(`[data-automation-id="adf-cloud-group-chip-${userName}"]`); - } diff --git a/e2e-playwright/process-services-cloud/components/people.component.ts b/e2e-playwright/process-services-cloud/components/people.component.ts index c3134b5628..1d5b511c4d 100644 --- a/e2e-playwright/process-services-cloud/components/people.component.ts +++ b/e2e-playwright/process-services-cloud/components/people.component.ts @@ -17,12 +17,11 @@ import { Page } from '@playwright/test'; import { BaseComponent } from '../../page-object/components/base.component'; -import { ErrorComponent, TooltipComponent, ListboxComponent } from '../../page-object/components'; +import { ErrorComponent, ListboxComponent } from '../../page-object/components'; export class PeopleComponent extends BaseComponent { private static rootElement = 'adf-cloud-people'; public error = new ErrorComponent(this.page); - public tooltip = new TooltipComponent(this.page); public listbox = new ListboxComponent(this.page); public usersNaming = this.getChild('[data-automation-id="adf-cloud-people-chip-list"]'); @@ -33,5 +32,4 @@ export class PeopleComponent extends BaseComponent { } public getUserLocator = (userName: string) => this.getChild(`[data-automation-id="adf-people-cloud-chip-${userName}"]`); - } diff --git a/e2e-playwright/process-services-cloud/specs/groups-cloud.e2e.ts b/e2e-playwright/process-services-cloud/specs/groups-cloud.e2e.ts index 2979453305..cf1020a6e9 100644 --- a/e2e-playwright/process-services-cloud/specs/groups-cloud.e2e.ts +++ b/e2e-playwright/process-services-cloud/specs/groups-cloud.e2e.ts @@ -39,9 +39,6 @@ test.describe('Groups component stories tests', () => { await processServicesCloud.navigateTo({ moduleNames: ['group-cloud'], componentName: 'group-cloud', story: 'mandatory-preselected-groups' }); await expect.soft(groupComponent.groupNaming).toContainText(expectedUsersName); - - await groupComponent.getUserLocator('Meat Chicken').hover(); - await expect(groupComponent.tooltip.content).toContainText('Mandatory'); }); test('Invalid Preselected Groups', async ({ processServicesCloud, groupComponent }) => { @@ -52,5 +49,4 @@ test.describe('Groups component stories tests', () => { await expect(groupComponent.error.content).toContainText(expectedWarningIcon + expectedWarningMessage); }); - }); diff --git a/e2e-playwright/process-services-cloud/specs/people-cloud.e2e.ts b/e2e-playwright/process-services-cloud/specs/people-cloud.e2e.ts index e3ec3ca256..01cc1267de 100644 --- a/e2e-playwright/process-services-cloud/specs/people-cloud.e2e.ts +++ b/e2e-playwright/process-services-cloud/specs/people-cloud.e2e.ts @@ -42,7 +42,6 @@ test.describe('People component stories tests', () => { await peopleComponent.getUserLocator('Kielbasa Sausage').hover(); await expect.soft(peopleComponent.usersNaming).toContainText(expectedUsersName); - await expect(peopleComponent.tooltip.content).toContainText('Mandatory'); }); test('Invalid Preselected Users', async ({ processServicesCloud, peopleComponent }) => { diff --git a/lib/content-services/src/lib/aspect-list/aspect-list.component.html b/lib/content-services/src/lib/aspect-list/aspect-list.component.html index 8877ca36d3..f27daac042 100644 --- a/lib/content-services/src/lib/aspect-list/aspect-list.component.html +++ b/lib/content-services/src/lib/aspect-list/aspect-list.component.html @@ -16,7 +16,7 @@ + [title]="getTitle(aspect)"> {{getTitle(aspect)}} diff --git a/lib/content-services/src/lib/aspect-list/aspect-list.module.ts b/lib/content-services/src/lib/aspect-list/aspect-list.module.ts index 91a57f41e8..03308022a1 100644 --- a/lib/content-services/src/lib/aspect-list/aspect-list.module.ts +++ b/lib/content-services/src/lib/aspect-list/aspect-list.module.ts @@ -26,7 +26,6 @@ import { TranslateModule } from '@ngx-translate/core'; import { MatDialogModule } from '@angular/material/dialog'; import { AspectListDialogComponent } from './aspect-list-dialog.component'; import { MatButtonModule } from '@angular/material/button'; -import { MatTooltipModule } from '@angular/material/tooltip'; import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; import { ContentDirectiveModule } from '../directives/content-directive.module'; @@ -40,17 +39,10 @@ import { ContentDirectiveModule } from '../directives/content-directive.module'; TranslateModule, MatDialogModule, MatButtonModule, - MatTooltipModule, MatProgressSpinnerModule, ContentDirectiveModule ], - exports: [ - AspectListComponent, - AspectListDialogComponent - ], - declarations: [ - AspectListComponent, - AspectListDialogComponent - ] + exports: [AspectListComponent, AspectListDialogComponent], + declarations: [AspectListComponent, AspectListDialogComponent] }) -export class AspectListModule { } +export class AspectListModule {} diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.html b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.html index 93a7145266..00cd590fbf 100644 --- a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.html +++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.html @@ -25,7 +25,7 @@ {{ 'NODE_SELECTOR.UPLOAD_FROM_DEVICE' | translate }} info + title="{{ getWarningMessage() | translate }}">info diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts index f27f4fd2b4..8daaeb7ba3 100644 --- a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts +++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts @@ -334,12 +334,12 @@ describe('ContentNodeSelectorComponent', () => { fixture.detectChanges(); const infoMatIcon = getTabInfoButton(); - const iconTooltipMessage = infoMatIcon.attributes['ng-reflect-message']; + const iconTooltipMessage = infoMatIcon.attributes['title']; const expectedMessage = 'NODE_SELECTOR.UPLOAD_BUTTON_SEARCH_WARNING_MESSAGE'; expect(component.getWarningMessage()).toEqual(expectedMessage); - expect(iconTooltipMessage).toEqual(expectedMessage.substring(0, 30)); + expect(iconTooltipMessage).toEqual(expectedMessage); }); it('should not be able to show warning message if it is not in search mode', () => { @@ -394,11 +394,11 @@ describe('ContentNodeSelectorComponent', () => { fixture.detectChanges(); const infoMatIcon = getTabInfoButton(); - const iconTooltipMessage = infoMatIcon.attributes['ng-reflect-message']; + const iconTooltipMessage = infoMatIcon.attributes['title']; const expectedMessage = 'NODE_SELECTOR.UPLOAD_BUTTON_PERMISSION_WARNING_MESSAGE'; expect(component.getWarningMessage()).toEqual(expectedMessage); - expect(iconTooltipMessage).toEqual(expectedMessage.substring(0, 30)); + expect(iconTooltipMessage).toEqual(expectedMessage); }); it('should not be able to show warning message while loading documents', () => { diff --git a/lib/content-services/src/lib/dialogs/node-lock.dialog.html b/lib/content-services/src/lib/dialogs/node-lock.dialog.html index 7effb315cb..23f917f749 100644 --- a/lib/content-services/src/lib/dialogs/node-lock.dialog.html +++ b/lib/content-services/src/lib/dialogs/node-lock.dialog.html @@ -5,13 +5,13 @@
- + {{ 'CORE.FILE_DIALOG.FILE_LOCK_CHECKBOX' | translate }} "{{ nodeName }}"
-
+
{{ 'CORE.FILE_DIALOG.ALLOW_OTHERS_CHECKBOX' | translate }} @@ -24,7 +24,7 @@
- + diff --git a/lib/content-services/src/lib/search/components/search-check-list/search-check-list.component.html b/lib/content-services/src/lib/search/components/search-check-list/search-check-list.component.html index ba34d887f1..d25872d267 100644 --- a/lib/content-services/src/lib/search/components/search-check-list/search-check-list.component.html +++ b/lib/content-services/src/lib/search/components/search-check-list/search-check-list.component.html @@ -8,9 +8,7 @@ [attr.aria-label]="option.name | translate" (change)="changeHandler($event, option)" class="adf-facet-filter"> -
+
{{ option.name | translate }}
diff --git a/lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.html b/lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.html index 91b08741e0..ec7c9ef5e0 100644 --- a/lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.html +++ b/lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.html @@ -4,14 +4,11 @@ class="adf-option-chips adf-autocomplete-added-option-chips" *ngFor="let option of selectedOptions" (removed)="remove(option)"> - + {{ option.value }} - @@ -33,10 +30,9 @@ {{ option.fullPath || option.value }} diff --git a/lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts b/lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts index df7f95df42..030afa23a9 100644 --- a/lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts +++ b/lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts @@ -67,7 +67,7 @@ export class SearchChipAutocompleteInputComponent implements OnInit, OnDestroy, @Input() filter = (options: AutocompleteOption[], value: string): AutocompleteOption[] => { const filterValue = value.toLowerCase(); - return options.filter(option => option.value.toLowerCase().includes(filterValue)).slice(0, 15); + return options.filter((option) => option.value.toLowerCase().includes(filterValue)).slice(0, 15); }; @Output() @@ -80,7 +80,6 @@ export class SearchChipAutocompleteInputComponent implements OnInit, OnDestroy, formCtrl = new FormControl(''); filteredOptions: AutocompleteOption[] = []; selectedOptions: AutocompleteOption[] = []; - tooltipShowDelay = 800; private onDestroy$ = new Subject(); private _activeAnyOption = false; @@ -92,7 +91,7 @@ export class SearchChipAutocompleteInputComponent implements OnInit, OnDestroy, this.formCtrl.valueChanges .pipe( startWith(''), - tap(() => this.activeAnyOption = false), + tap(() => (this.activeAnyOption = false)), debounce((value: string) => (value ? timer(300) : EMPTY)), takeUntil(this.onDestroy$) ) @@ -105,7 +104,10 @@ export class SearchChipAutocompleteInputComponent implements OnInit, OnDestroy, ngOnChanges(changes: SimpleChanges) { if (changes.autocompleteOptions) { - this.filteredOptions = changes.autocompleteOptions.currentValue?.length > 0 ? this.filter(changes.autocompleteOptions.currentValue, this.formCtrl.value) : []; + this.filteredOptions = + changes.autocompleteOptions.currentValue?.length > 0 + ? this.filter(changes.autocompleteOptions.currentValue, this.formCtrl.value) + : []; } } @@ -123,10 +125,10 @@ export class SearchChipAutocompleteInputComponent implements OnInit, OnDestroy, if (value && this.isExists(value) && !this.isAdded(value)) { if (this.allowOnlyPredefinedValues) { - const index = this.autocompleteOptions.findIndex(option => option.value.toLowerCase() === value.toLowerCase()); + const index = this.autocompleteOptions.findIndex((option) => option.value.toLowerCase() === value.toLowerCase()); this.selectedOptions.push(this.autocompleteOptions[index]); } else { - this.selectedOptions.push({value}); + this.selectedOptions.push({ value }); } this.optionsChanged.emit(this.selectedOptions); event.chipInput.clear(); @@ -153,14 +155,12 @@ export class SearchChipAutocompleteInputComponent implements OnInit, OnDestroy, private isAdded(value: string): boolean { const valueLowerCase = value.toLowerCase(); - return this.selectedOptions.some(option => option.value.toLowerCase() === valueLowerCase); + return this.selectedOptions.some((option) => option.value.toLowerCase() === valueLowerCase); } private isExists(value: string): boolean { const valueLowerCase = value.toLowerCase(); - return this.allowOnlyPredefinedValues - ? this.autocompleteOptions.some(option => option.value.toLowerCase() === valueLowerCase) - : true; + return this.allowOnlyPredefinedValues ? this.autocompleteOptions.some((option) => option.value.toLowerCase() === valueLowerCase) : true; } private reset() { diff --git a/lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.html b/lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.html index 451d5c5e51..876672ba80 100644 --- a/lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.html +++ b/lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.html @@ -5,8 +5,7 @@ color="primary" selected class="adf-search-chip-list-item" - matTooltip="{{ 'SEARCH.FILTER.BUTTONS.CLEAR-ALL.TOOLTIP' | translate }}" - matTooltipPosition="right" + title="{{ 'SEARCH.FILTER.BUTTONS.CLEAR-ALL.TOOLTIP' | translate }}" (click)="facetFiltersService.resetAllSelectedBuckets()"> {{ 'SEARCH.FILTER.BUTTONS.CLEAR-ALL.LABEL' | translate }} diff --git a/lib/content-services/src/lib/search/components/search-facet-field/search-facet-field.component.html b/lib/content-services/src/lib/search/components/search-facet-field/search-facet-field.component.html index 166330f4f0..5c1b56eaf5 100644 --- a/lib/content-services/src/lib/search/components/search-facet-field/search-facet-field.component.html +++ b/lib/content-services/src/lib/search/components/search-facet-field/search-facet-field.component.html @@ -34,8 +34,7 @@ class="adf-search-filter-facet-checkbox" >
diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component.html b/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component.html index 99454f4ae6..8de3b12dcf 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component.html +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component.html @@ -4,9 +4,8 @@ @@ -17,7 +16,7 @@ {{ category.name | translate }} - diff --git a/lib/content-services/src/lib/search/components/search-radio/search-radio.component.html b/lib/content-services/src/lib/search/components/search-radio/search-radio.component.html index 794673eb17..b94574f416 100644 --- a/lib/content-services/src/lib/search/components/search-radio/search-radio.component.html +++ b/lib/content-services/src/lib/search/components/search-radio/search-radio.component.html @@ -6,10 +6,7 @@ *ngFor="let option of options" [value]="option.value" class="adf-facet-filter"> -
+
{{ option.name | translate }}
diff --git a/lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.html b/lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.html index d976cb278c..42784c14cc 100644 --- a/lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.html +++ b/lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.html @@ -12,8 +12,7 @@ mat-icon-button (click)="toggleCompact()" color="primary" - [matTooltip]="'CORE.BREADCRUMBS.SHOWALL' | translate" - matTooltipClass="adf-tooltip" + [title]="'CORE.BREADCRUMBS.SHOWALL' | translate" [attr.aria-label]="'CORE.BREADCRUMBS.SHOWALL' | translate" > more_vert diff --git a/lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.ts b/lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.ts index b0738e9546..50d1fe8ab4 100644 --- a/lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.ts +++ b/lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.ts @@ -15,11 +15,24 @@ * limitations under the License. */ -import { AfterContentInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, Input, OnChanges, Output, QueryList, SimpleChanges, TemplateRef, ViewChildren } from '@angular/core'; +import { + AfterContentInit, + ChangeDetectionStrategy, + ChangeDetectorRef, + Component, + ContentChildren, + EventEmitter, + Input, + OnChanges, + Output, + QueryList, + SimpleChanges, + TemplateRef, + ViewChildren +} from '@angular/core'; import { CommonModule } from '@angular/common'; import { MatButtonModule } from '@angular/material/button'; import { MatIconModule } from '@angular/material/icon'; -import { MatTooltipModule } from '@angular/material/tooltip'; import { map, startWith } from 'rxjs/operators'; import { TranslateModule } from '@ngx-translate/core'; @@ -32,7 +45,7 @@ import { BreadcrumbItemComponent } from '../breadcrumb-item/breadcrumb-item.comp templateUrl: './breadcrumb.component.html', styleUrls: ['./breadcrumb.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush, - imports: [ CommonModule, MatIconModule, TranslateModule, MatButtonModule, MatTooltipModule ] + imports: [CommonModule, MatIconModule, TranslateModule, MatButtonModule, BreadcrumbFocusDirective] }) export class BreadcrumbComponent implements AfterContentInit, OnChanges { private _breadcrumbTemplateRefs: Array> = []; @@ -57,9 +70,7 @@ export class BreadcrumbComponent implements AfterContentInit, OnChanges { this.breadcrumbItems.changes .pipe( startWith(this.breadcrumbItems), - map((breadcrumbItems: QueryList) => - this.mapToTemplateRefs(breadcrumbItems) - ) + map((breadcrumbItems: QueryList) => this.mapToTemplateRefs(breadcrumbItems)) ) .subscribe((templateRefs) => { this._breadcrumbTemplateRefs = templateRefs; @@ -83,16 +94,11 @@ export class BreadcrumbComponent implements AfterContentInit, OnChanges { } private setBreadcrumbs(breadcrumbs: Array>) { - this.selectedBreadcrumbs = - this.compact && breadcrumbs.length > 2 - ? [breadcrumbs[0], breadcrumbs[breadcrumbs.length - 1]] - : [...breadcrumbs]; + this.selectedBreadcrumbs = this.compact && breadcrumbs.length > 2 ? [breadcrumbs[0], breadcrumbs[breadcrumbs.length - 1]] : [...breadcrumbs]; this.cdr.detectChanges(); } - private mapToTemplateRefs( breadcrumbItems: QueryList ) { - return breadcrumbItems - .toArray() - .map((breadcrumbItem) => breadcrumbItem.templateRef); + private mapToTemplateRefs(breadcrumbItems: QueryList) { + return breadcrumbItems.toArray().map((breadcrumbItem) => breadcrumbItem.templateRef); } } diff --git a/lib/core/feature-flags/src/lib/components/flags/flags.component.html b/lib/core/feature-flags/src/lib/components/flags/flags.component.html index 0adcfeed50..9afde84ff7 100644 --- a/lib/core/feature-flags/src/lib/components/flags/flags.component.html +++ b/lib/core/feature-flags/src/lib/components/flags/flags.component.html @@ -45,7 +45,7 @@
-
-
+
- + {{form.taskName}} {{'FORM.FORM_RENDERER.NAMELESS_TASK' | translate}} diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/attach-file-cloud-widget.component.html b/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/attach-file-cloud-widget.component.html index b362837564..83778baea0 100644 --- a/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/attach-file-cloud-widget.component.html +++ b/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/attach-file-cloud-widget.component.html @@ -12,9 +12,7 @@ class="adf-attach-widget__menu-upload__button" color="primary" [id]="field.id" - [matTooltip]="field.tooltip" - matTooltipPosition="above" - matTooltipShowDelay="1000"> + [title]="field.tooltip"> {{ 'FORM.FIELD.ATTACH' | translate }} {{getWidgetIcon()}} diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/attach-file-cloud-widget.component.spec.ts b/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/attach-file-cloud-widget.component.spec.ts index 92e8fd44ef..1fc5ef56af 100644 --- a/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/attach-file-cloud-widget.component.spec.ts +++ b/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/attach-file-cloud-widget.component.spec.ts @@ -71,9 +71,6 @@ import { import { By } from '@angular/platform-browser'; import { of, throwError } from 'rxjs'; import { FormCloudModule } from '../../../form-cloud.module'; -import { HarnessLoader } from '@angular/cdk/testing'; -import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'; -import { MatTooltipHarness } from '@angular/material/tooltip/testing'; const mockNodeToBeVersioned: any = { isFile: true, @@ -125,7 +122,6 @@ describe('AttachFileCloudWidgetComponent', () => { let localizedDataPipe: LocalizedDatePipe; let newVersionUploaderService: NewVersionUploaderService; let notificationService: NotificationService; - let loader: HarnessLoader; const createUploadWidgetField = ( form: FormModel, @@ -169,7 +165,6 @@ describe('AttachFileCloudWidgetComponent', () => { contentNodeSelectorPanelService = TestBed.inject(ContentNodeSelectorPanelService); openUploadFileDialogSpy = spyOn(contentCloudNodeSelectorService, 'openUploadFileDialog').and.returnValue(of([fakeNode])); localizedDataPipe = new LocalizedDatePipe(); - loader = TestbedHarnessEnvironment.loader(fixture); }); afterEach(() => { @@ -926,37 +921,4 @@ describe('AttachFileCloudWidgetComponent', () => { expect(spyOnShowError).toHaveBeenCalledWith(mockError.value); }); }); - - describe('when tooltip is set', () => { - beforeEach(() => { - widget.field = new FormFieldModel(new FormModel({ taskId: '' }), { - type: FormFieldTypes.UPLOAD, - tooltip: 'my custom tooltip' - }); - fixture.detectChanges(); - }); - - it('should show tooltip', async () => { - const attachButton = fixture.nativeElement.querySelector('button'); - attachButton.dispatchEvent(new Event('mouseenter')); - - const tooltipElement = await loader.getHarness(MatTooltipHarness); - - expect(await tooltipElement.isOpen()).toBeTrue(); - expect(await tooltipElement.getTooltipText()).toBe('my custom tooltip'); - }); - - it('should hide tooltip', async () => { - const attachButton = fixture.nativeElement.querySelector('.adf-attach-widget__menu-upload__button'); - attachButton.dispatchEvent(new Event('mouseenter')); - fixture.detectChanges(); - - attachButton.dispatchEvent(new Event('mouseleave')); - fixture.detectChanges(); - - const tooltipElement = await loader.getHarness(MatTooltipHarness); - - expect(await tooltipElement.isOpen()).toBeFalse(); - }); - }); }); diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/upload-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/upload-cloud.widget.html index b753875a45..cb86bacdfd 100644 --- a/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/upload-cloud.widget.html +++ b/lib/process-services-cloud/src/lib/form/components/widgets/attach-file/upload-cloud.widget.html @@ -20,8 +20,7 @@
- diff --git a/lib/process-services-cloud/src/lib/task/task-filters/components/edit-task-filters/base-edit-task-filter-cloud.component.html b/lib/process-services-cloud/src/lib/task/task-filters/components/edit-task-filters/base-edit-task-filter-cloud.component.html index a250f28f09..5bd7db504c 100644 --- a/lib/process-services-cloud/src/lib/task/task-filters/components/edit-task-filters/base-edit-task-filter-cloud.component.html +++ b/lib/process-services-cloud/src/lib/task/task-filters/components/edit-task-filters/base-edit-task-filter-cloud.component.html @@ -10,7 +10,7 @@
- + {{form.taskName}} {{'FORM.FORM_RENDERER.NAMELESS_TASK' | translate}} diff --git a/lib/process-services/src/lib/form/form.component.ts b/lib/process-services/src/lib/form/form.component.ts index 9ca3388f7f..c1469455e3 100644 --- a/lib/process-services/src/lib/form/form.component.ts +++ b/lib/process-services/src/lib/form/form.component.ts @@ -45,13 +45,12 @@ 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, MatTooltipModule, TranslateModule, FormRendererComponent, FormatSpacePipe], + imports: [CommonModule, MatCardModule, MatButtonModule, MatIconModule, TranslateModule, FormRendererComponent, FormatSpacePipe], templateUrl: './form.component.html', encapsulation: ViewEncapsulation.None }) diff --git a/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.html b/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.html index 2920c72171..d705beb6e6 100644 --- a/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.html +++ b/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.html @@ -72,7 +72,7 @@ matLine id="{{ 'file-' + file.id }}" (click)="onAttachFileClicked(file)" - [matTooltip]="file.name" + [title]="file.name" (keyup.enter)="onAttachFileClicked(file)" tabindex="0" role="button" diff --git a/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.ts b/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.ts index 7fff3594c3..330e481f49 100644 --- a/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.ts +++ b/lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.ts @@ -33,12 +33,11 @@ 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, MatTooltipModule, ErrorWidgetComponent], + imports: [CommonModule, TranslateModule, MatIconModule, MatButtonModule, MatMenuModule, MatListModule, ErrorWidgetComponent], templateUrl: './attach-file-widget.component.html', styleUrls: ['./attach-file-widget.component.scss'], host: { diff --git a/lib/process-services/src/lib/form/widgets/people/people.widget.html b/lib/process-services/src/lib/form/widgets/people/people.widget.html index 0e6b03d9d0..86fe98b3f0 100644 --- a/lib/process-services/src/lib/form/widgets/people/people.widget.html +++ b/lib/process-services/src/lib/form/widgets/people/people.widget.html @@ -14,9 +14,7 @@ [placeholder]="field.placeholder" [matAutocomplete]="auto" (blur)="markAsTouched()" - [matTooltip]="field.tooltip" - matTooltipPosition="above" - matTooltipShowDelay="1000"> + [title]="field.tooltip"> { await fixture.whenStable(); const radioButtonsElement: any = element.querySelector('#people-id'); - const tooltip = radioButtonsElement.getAttribute('ng-reflect-message'); + const tooltip = radioButtonsElement.getAttribute('title'); expect(tooltip).toEqual(widget.field.tooltip); }); diff --git a/lib/process-services/src/lib/form/widgets/people/people.widget.ts b/lib/process-services/src/lib/form/widgets/people/people.widget.ts index 20fccd18ef..c5e9d3381b 100644 --- a/lib/process-services/src/lib/form/widgets/people/people.widget.ts +++ b/lib/process-services/src/lib/form/widgets/people/people.widget.ts @@ -29,7 +29,6 @@ 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', @@ -41,7 +40,6 @@ import { MatTooltipModule } from '@angular/material/tooltip'; MatInputModule, ReactiveFormsModule, MatAutocompleteModule, - MatTooltipModule, InitialUsernamePipe, ErrorWidgetComponent ], diff --git a/lib/process-services/src/lib/form/widgets/radio-buttons/radio-buttons.widget.html b/lib/process-services/src/lib/form/widgets/radio-buttons/radio-buttons.widget.html index 98d625c023..72b6f00861 100644 --- a/lib/process-services/src/lib/form/widgets/radio-buttons/radio-buttons.widget.html +++ b/lib/process-services/src/lib/form/widgets/radio-buttons/radio-buttons.widget.html @@ -4,9 +4,7 @@ { let formService: FormService; @@ -242,9 +241,9 @@ describe('RadioButtonsWidgetComponent', () => { fixture.detectChanges(); - const tooltip = await loader.getHarness(MatTooltipHarness.with({ selector: '#radio-id-opt-1' })); - await tooltip.show(); - expect(await tooltip.getTooltipText()).toEqual(radioButtonWidget.field.tooltip); + 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); }); describe('and radioButton is populated via taskId', () => { diff --git a/lib/process-services/src/lib/form/widgets/radio-buttons/radio-buttons.widget.ts b/lib/process-services/src/lib/form/widgets/radio-buttons/radio-buttons.widget.ts index 1db655ff16..288012dd7f 100644 --- a/lib/process-services/src/lib/form/widgets/radio-buttons/radio-buttons.widget.ts +++ b/lib/process-services/src/lib/form/widgets/radio-buttons/radio-buttons.widget.ts @@ -25,12 +25,11 @@ 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, MatTooltipModule, ErrorWidgetComponent], + imports: [CommonModule, TranslateModule, MatRadioModule, FormsModule, ErrorWidgetComponent], templateUrl: './radio-buttons.widget.html', styleUrls: ['./radio-buttons.widget.scss'], host: { diff --git a/lib/process-services/src/lib/task-list/components/checklist/checklist.component.html b/lib/process-services/src/lib/task-list/components/checklist/checklist.component.html index cd654deee5..9f792d4814 100644 --- a/lib/process-services/src/lib/task-list/components/checklist/checklist.component.html +++ b/lib/process-services/src/lib/task-list/components/checklist/checklist.component.html @@ -5,7 +5,7 @@ - diff --git a/lib/process-services/src/lib/task-list/components/checklist/checklist.component.ts b/lib/process-services/src/lib/task-list/components/checklist/checklist.component.ts index 2fa38229ba..c7582f8e76 100644 --- a/lib/process-services/src/lib/task-list/components/checklist/checklist.component.ts +++ b/lib/process-services/src/lib/task-list/components/checklist/checklist.component.ts @@ -23,7 +23,6 @@ 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'; @@ -37,7 +36,6 @@ import { FormsModule } from '@angular/forms'; TranslateModule, MatChipsModule, MatButtonModule, - MatTooltipModule, MatIconModule, MatDialogModule, MatFormFieldModule,