diff --git a/src/app/header/context-help-toggle/context-help-toggle.component.html b/src/app/header/context-help-toggle/context-help-toggle.component.html index f815312739c..997ae80fb5c 100644 --- a/src/app/header/context-help-toggle/context-help-toggle.component.html +++ b/src/app/header/context-help-toggle/context-help-toggle.component.html @@ -1,12 +1,11 @@ @if (buttonVisible$ | async) {
- + [title]="'nav.context-help-toggle' | translate"> - +
} diff --git a/src/app/header/context-help-toggle/context-help-toggle.component.scss b/src/app/header/context-help-toggle/context-help-toggle.component.scss index f3e5e01880a..f8cbd4047af 100644 --- a/src/app/header/context-help-toggle/context-help-toggle.component.scss +++ b/src/app/header/context-help-toggle/context-help-toggle.component.scss @@ -1,3 +1,10 @@ +.ds-context-help-toggle-button { + background: none; + border: 0; + padding: 0; + cursor: pointer; +} + .ds-context-help-toggle { color: var(--ds-header-icon-color); background-color: var(--ds-header-bg); diff --git a/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts b/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts index 5172cfd9913..45995afcd87 100644 --- a/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts +++ b/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts @@ -56,10 +56,17 @@ describe('ContextHelpToggleComponent', () => { }); it('clicking the button should toggle context help icon visibility', fakeAsync(() => { - fixture.debugElement.query(By.css('a')).nativeElement.click(); + fixture.debugElement.query(By.css('button')).nativeElement.click(); tick(); expect(contextHelpService.toggleIcons).toHaveBeenCalled(); })); + + it('the toggle should be a real @if ((active$ | async).valueOf() === true) {
so user agents do not apply native button chrome + button.ds-menu-toggler-wrapper { + background: none; + border: 0; + padding: 0; + color: inherit; + font: inherit; + cursor: pointer; + } + .dropdown-menu { overflow: hidden; min-width: 100%; diff --git a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts index fb0e66d9e82..5535b3908bf 100644 --- a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts +++ b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts @@ -57,6 +57,15 @@ describe('ExpandableNavbarSectionComponent', () => { fixture.detectChanges(); }); + describe('toggler element', () => { + it('should be a real @@ -20,7 +21,7 @@ @if (canActivate) {
-