Skip to content
This repository was archived by the owner on Jan 6, 2025. It is now read-only.

Commit 23592ee

Browse files
CaerusKaruThomasBurleson
authored andcommitted
fix(core): avoid duplicate mediaQuery activations (#937)
1 parent 4be5cef commit 23592ee

File tree

2 files changed

+17
-7
lines changed

2 files changed

+17
-7
lines changed

src/lib/core/media-marshaller/media-marshaller.spec.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ describe('media-marshaller', () => {
2222
providers: [MockMatchMediaProvider]
2323
});
2424
spyOn(MediaMarshaller.prototype, 'activate').and.callThrough();
25+
spyOn(MediaMarshaller.prototype, 'updateStyles').and.callThrough();
2526
});
2627

2728
// Single async inject to save references; which are used in all tests below
@@ -39,6 +40,12 @@ describe('media-marshaller', () => {
3940
expect(mediaMarshaller.activate).toHaveBeenCalled();
4041
});
4142

43+
it('doesn\'t activate when match-media activates the same breakpoint twice', () => {
44+
matchMedia.activate('xs');
45+
matchMedia.activate('xs');
46+
expect(mediaMarshaller.updateStyles).toHaveBeenCalledTimes(1);
47+
});
48+
4249
it('should set correct activated breakpoint', () => {
4350
matchMedia.activate('lg');
4451
expect(mediaMarshaller.activatedBreakpoint).toBe('lg');

src/lib/core/media-marshaller/media-marshaller.ts

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -65,14 +65,17 @@ export class MediaMarshaller {
6565
*/
6666
activate(mc: MediaChange) {
6767
const bp: BreakPoint | null = this.findByQuery(mc.mediaQuery);
68-
if (mc.matches && bp) {
69-
this.activatedBreakpoints.push(bp);
70-
this.activatedBreakpoints.sort(prioritySort);
71-
} else if (!mc.matches && bp) {
72-
// Remove the breakpoint when it's deactivated
73-
this.activatedBreakpoints.splice(this.activatedBreakpoints.indexOf(bp), 1);
68+
if (bp) {
69+
if (mc.matches && this.activatedBreakpoints.indexOf(bp) === -1) {
70+
this.activatedBreakpoints.push(bp);
71+
this.activatedBreakpoints.sort(prioritySort);
72+
this.updateStyles();
73+
} else if (!mc.matches && this.activatedBreakpoints.indexOf(bp) !== -1) {
74+
// Remove the breakpoint when it's deactivated
75+
this.activatedBreakpoints.splice(this.activatedBreakpoints.indexOf(bp), 1);
76+
this.updateStyles();
77+
}
7478
}
75-
this.updateStyles();
7679
}
7780

7881
/**

0 commit comments

Comments
 (0)