Skip to content

Fixing memory leak for expansion-panel (#8403) #8410

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Nov 20, 2017
Merged

Fixing memory leak for expansion-panel (#8403) #8410

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
b688604
Fixing memory leak for expansion-panel (#8403)
anthonn Nov 13, 2017
5e37289
Adding unit test for - Fixing memory leak for expansion-panel (#8403)
anthonn Nov 14, 2017
555632a
Adding unit test for - Fixing memory leak for expansion-panel (#8403)
anthonn Nov 14, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/lib/expansion/expansion-panel.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -142,6 +142,7 @@ export class MatExpansionPanel extends _MatExpansionPanelMixinBase
}

ngOnDestroy() {
super.ngOnDestroy();
Copy link
Member

@jelbourn jelbourn Nov 13, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you add a unit test for this change?

Copy link
Contributor Author

@anthonn anthonn Nov 13, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I really tried to come up with a unit test, but I have not written unit tests for Jasmin/Karma before so I didnt really get it to work.

This is what I came up with but chrome hangs during execution:

it('make sure accordion item runs ngOnDestroy when expansion panel is destroyed', () => {
  let fixture = TestBed.createComponent(PanelWithContent);
  spyOn(fixture.componentInstance.panel.destroyed, 'emit');
  fixture.componentInstance.panel.ngOnDestroy();      
  fixture.detectChanges();
  expect(fixture.componentInstance.panel.destroyed.emit).toHaveBeenCalled();
});

Copy link
Contributor Author

@anthonn anthonn Nov 14, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, so I think I managed to make a correct unit test finally.

this._inputChanges.complete();
}
}
Expand Down
23 changes: 23 additions & 0 deletions src/lib/expansion/expansion.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ describe('MatExpansionPanel', () => {
],
declarations: [
PanelWithContent,
PanelWithContentInNgIf,
PanelWithCustomMargin
],
});
Expand Down Expand Up @@ -138,6 +139,16 @@ describe('MatExpansionPanel', () => {
expect(arrow.style.transform).toBe('rotate(180deg)', 'Expected 180 degree rotation.');
}));

it('make sure accordion item runs ngOnDestroy when expansion panel is destroyed', () => {
let fixture = TestBed.createComponent(PanelWithContentInNgIf);
fixture.detectChanges();
let destroyedOk = false;
fixture.componentInstance.panel.destroyed.subscribe(() => destroyedOk = true);
fixture.componentInstance.expansionShown = false;
fixture.detectChanges();
expect(destroyedOk).toBe(true);
});

describe('disabled state', () => {
let fixture: ComponentFixture<PanelWithContent>;
let panel: HTMLElement;
Expand Down Expand Up @@ -221,6 +232,18 @@ class PanelWithContent {
@ViewChild(MatExpansionPanel) panel: MatExpansionPanel;
}

@Component({
template: `
<div *ngIf="expansionShown">
<mat-expansion-panel>
<mat-expansion-panel-header>Panel Title</mat-expansion-panel-header>
</mat-expansion-panel>
</div>`
})
class PanelWithContentInNgIf {
expansionShown = true;
@ViewChild(MatExpansionPanel) panel: MatExpansionPanel;
}

@Component({
styles: [
Expand Down