From 93a6243779d136d7b4ac3600bf8c9c97225b0bb2 Mon Sep 17 00:00:00 2001 From: Deborah Date: Thu, 9 May 2024 15:40:35 +0100 Subject: [PATCH 1/2] accordion: fix broken unit test --- .../components/accordion/accordion.spec.ts | 60 ++++++++++++++++--- 1 file changed, 53 insertions(+), 7 deletions(-) diff --git a/src/app/components/accordion/accordion.spec.ts b/src/app/components/accordion/accordion.spec.ts index 58652aaa707..25fb5c0348e 100755 --- a/src/app/components/accordion/accordion.spec.ts +++ b/src/app/components/accordion/accordion.spec.ts @@ -3,7 +3,7 @@ import { By } from '@angular/platform-browser'; import { Accordion } from './accordion'; import { AccordionTab } from './accordion'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { Component, DebugElement, NO_ERRORS_SCHEMA } from '@angular/core'; +import { Component, NO_ERRORS_SCHEMA } from '@angular/core'; @Component({ template: ` @@ -175,15 +175,61 @@ describe('Accordion', () => { expect(secondAccordionTabHeaderEl.className).toContain('p-highlight'); }); - it('should be closed', () => { - fixture.detectChanges(); - - const secondAccordionTabOpenEl = fixture.debugElement.children[0].children[0].children[1].query(By.css('a')).nativeElement; - let spaceEvent = { which: 32, preventDefault() {} }; - secondAccordionTab.onKeydown(spaceEvent as KeyboardEvent); + it('should be toggle on space and enter keydown event', () => { fixture.detectChanges(); const secondAccordionTabHeaderEl = fixture.debugElement.children[0].children[0].children[1].query(By.css('.p-accordion-header')).nativeElement; + expect(secondAccordionTabHeaderEl.className).not.toContain('p-highlight'); + + //toggle when enter is pressed + const spaceEvent = new KeyboardEvent('keydown', { key: 'Enter', code: 'Enter' }); + secondAccordionTab.onKeydown(spaceEvent); + expect(secondAccordionTabHeaderEl.className).toContain('p-highlight'); + + //toggle when space is pressed + const keyDownEvent = new KeyboardEvent('keydown', { key: 'Space', code: 'Space' }); + secondAccordionTab.onKeydown(keyDownEvent); + fixture.detectChanges(); + + expect(secondAccordionTabHeaderEl.className).not.toContain('p-highlight'); + }); + + describe('onKeydown', () => { + let firstAccordionTabOpenEl; + let secondAccordionTabOpenEl; + + beforeEach(() => { + firstAccordionTabOpenEl = fixture.debugElement.children[0].children[0].children[0].query(By.css('a')).nativeElement; + secondAccordionTabOpenEl = fixture.debugElement.children[0].children[0].children[1].query(By.css('a')).nativeElement; + }); + + const testKeyBoardEvent = (keyCode, eventTarget, activeTab) => { + fixture.detectChanges(); + + const keyDownEvent = new KeyboardEvent('keydown', { code: keyCode }); + spyOnProperty(keyDownEvent, 'target', 'get').and.returnValue(eventTarget); + + accordion.onKeydown(keyDownEvent); + fixture.detectChanges(); + + expect(document.activeElement).toEqual(activeTab); + }; + + it('ArrowDown should focus on the next tab', () => { + testKeyBoardEvent('ArrowDown', firstAccordionTabOpenEl, secondAccordionTabOpenEl); + }); + + it('ArrowUp should focus on the next tab', () => { + testKeyBoardEvent('ArrowUp', secondAccordionTabOpenEl, firstAccordionTabOpenEl); + }); + + it('Home should focus on the first tab', () => { + testKeyBoardEvent('Home', secondAccordionTabOpenEl, firstAccordionTabOpenEl); + }); + + it('End should focus on the last tab', () => { + testKeyBoardEvent('End', firstAccordionTabOpenEl, secondAccordionTabOpenEl); + }); }); }); From 6dc4cc7e3691ad04e5f177a5076d9c288f6c9bf5 Mon Sep 17 00:00:00 2001 From: Deborah Date: Thu, 9 May 2024 15:42:57 +0100 Subject: [PATCH 2/2] rename variable --- src/app/components/accordion/accordion.spec.ts | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/app/components/accordion/accordion.spec.ts b/src/app/components/accordion/accordion.spec.ts index 25fb5c0348e..63dec232e57 100755 --- a/src/app/components/accordion/accordion.spec.ts +++ b/src/app/components/accordion/accordion.spec.ts @@ -196,12 +196,12 @@ describe('Accordion', () => { }); describe('onKeydown', () => { - let firstAccordionTabOpenEl; - let secondAccordionTabOpenEl; + let firstAccordionTabEl; + let secondAccordionTabEl; beforeEach(() => { - firstAccordionTabOpenEl = fixture.debugElement.children[0].children[0].children[0].query(By.css('a')).nativeElement; - secondAccordionTabOpenEl = fixture.debugElement.children[0].children[0].children[1].query(By.css('a')).nativeElement; + firstAccordionTabEl = fixture.debugElement.children[0].children[0].children[0].query(By.css('a')).nativeElement; + secondAccordionTabEl = fixture.debugElement.children[0].children[0].children[1].query(By.css('a')).nativeElement; }); const testKeyBoardEvent = (keyCode, eventTarget, activeTab) => { @@ -217,19 +217,19 @@ describe('Accordion', () => { }; it('ArrowDown should focus on the next tab', () => { - testKeyBoardEvent('ArrowDown', firstAccordionTabOpenEl, secondAccordionTabOpenEl); + testKeyBoardEvent('ArrowDown', firstAccordionTabEl, secondAccordionTabEl); }); it('ArrowUp should focus on the next tab', () => { - testKeyBoardEvent('ArrowUp', secondAccordionTabOpenEl, firstAccordionTabOpenEl); + testKeyBoardEvent('ArrowUp', secondAccordionTabEl, firstAccordionTabEl); }); it('Home should focus on the first tab', () => { - testKeyBoardEvent('Home', secondAccordionTabOpenEl, firstAccordionTabOpenEl); + testKeyBoardEvent('Home', secondAccordionTabEl, firstAccordionTabEl); }); it('End should focus on the last tab', () => { - testKeyBoardEvent('End', firstAccordionTabOpenEl, secondAccordionTabOpenEl); + testKeyBoardEvent('End', firstAccordionTabEl, secondAccordionTabEl); }); }); });