Skip to content
This repository was archived by the owner on May 11, 2020. It is now read-only.

Commit a17ea49

Browse files
wheeljsvthinkxie
authored andcommitted
fix(module:collapse): can't fold up active panel with accordion (NG-ZORRO#2440)
close NG-ZORRO#2437
1 parent 72b0f52 commit a17ea49

File tree

2 files changed

+30
-1
lines changed

2 files changed

+30
-1
lines changed

components/collapse/nz-collapse.component.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,10 @@ export class NzCollapseComponent {
4343
if (this.nzAccordion) {
4444
this.listOfPanel.forEach(item => {
4545
const active = collapse === item;
46-
if (item.nzActive !== active) {
46+
if (active && item.nzActive === active) {
47+
item.nzActive = false;
48+
item.nzActiveChange.emit(item.nzActive);
49+
} else if (item.nzActive !== active) {
4750
item.nzActive = active;
4851
item.nzActiveChange.emit(item.nzActive);
4952
}

components/collapse/nz-collapse.spec.ts

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,32 @@ describe('collapse', () => {
9898
expect(testComponent.active01Change).toHaveBeenCalledTimes(2);
9999
expect(testComponent.active02Change).toHaveBeenCalledTimes(1);
100100
});
101+
it('should click to fold up work with accordion', () => {
102+
testComponent.accordion = true;
103+
fixture.detectChanges();
104+
expect(panels[ 0 ].nativeElement.classList).not.toContain('ant-collapse-item-active');
105+
expect(testComponent.active01).toBe(false);
106+
panels[ 0 ].nativeElement.querySelector('.ant-collapse-header').click();
107+
fixture.detectChanges();
108+
panels[ 1 ].nativeElement.querySelector('.ant-collapse-header').click();
109+
fixture.detectChanges();
110+
panels[ 0 ].nativeElement.querySelector('.ant-collapse-header').click();
111+
fixture.detectChanges();
112+
expect(testComponent.active01).toBe(true);
113+
expect(testComponent.active02).toBe(false);
114+
expect(panels[ 0 ].nativeElement.classList).toContain('ant-collapse-item-active');
115+
expect(panels[ 1 ].nativeElement.classList).not.toContain('ant-collapse-item-active');
116+
expect(testComponent.active01Change).toHaveBeenCalledTimes(3);
117+
expect(testComponent.active02Change).toHaveBeenCalledTimes(2);
118+
panels[ 0 ].nativeElement.querySelector('.ant-collapse-header').click();
119+
fixture.detectChanges();
120+
expect(testComponent.active01).toBe(false);
121+
expect(testComponent.active02).toBe(false);
122+
expect(panels[ 0 ].nativeElement.classList).not.toContain('ant-collapse-item-active');
123+
expect(panels[ 1 ].nativeElement.classList).not.toContain('ant-collapse-item-active');
124+
expect(testComponent.active01Change).toHaveBeenCalledTimes(4);
125+
expect(testComponent.active02Change).toHaveBeenCalledTimes(2);
126+
});
101127
it('should header work', () => {
102128
fixture.detectChanges();
103129
expect(panels[ 0 ].nativeElement.querySelector('.ant-collapse-header').innerText).toBe('string');

0 commit comments

Comments
 (0)