Skip to content
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

Jump to bottom

BreakpointObserver.observe emits twice for adjacent breakpoints #10925

Closed
emilio-martinez opened this issue Apr 20, 2018 · 1 comment · Fixed by #11007
Closed

BreakpointObserver.observe emits twice for adjacent breakpoints #10925

emilio-martinez opened this issue Apr 20, 2018 · 1 comment · Fixed by #11007
Assignees
@josephperrott

Comments

@emilio-martinez
Copy link
Contributor

emilio-martinez commented Apr 20, 2018 •
edited
Loading

Bug, feature request, or proposal:

Bug

What is the expected behavior?

BreakpointObserver.observe stream should only return a single combined value based on the queries provided.

What is the current behavior?

BreakpointObserver.observe sometimes returns twice, particularly if two media queries are adjacent to each other, such is the case of something like

[
    Breakpoints.XSmall,
    Breakpoints.Small,
    Breakpoints.Medium
]

What are the steps to reproduce?

I've created a StackBlitz reproducing the problem. When commenting-out Breakpoints.XSmall, which is the only max-width-only ((max-width: Npx)) query, it seems to stop double-emitting, but not sure yet if max-width-only queries are the culprit.
https://stackblitz.com/edit/angular-hdpu9f?file=app%2Fapp.component.ts

What is the use-case or motivation for changing an existing behavior?

Avoiding double emission where unnecessary.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Repro packages are listed in Stackblitz as well, but here's the summary:

[email protected]
@angular/[email protected]
@angular/[email protected]

Is there anything else we should know?

Also brought up at #10791 (comment).
@emilio-martinez emilio-martinez changed the title BreakpointObserver emits twice BreakpointObserver.observe emits twice for adjacent breakpoints Apr 21, 2018
@jelbourn jelbourn assigned josephperrott and unassigned jelbourn Apr 24, 2018
@josephperrott josephperrott mentioned this issue Apr 25, 2018
Merged
TrevorKarjanis added a commit to TrevorKarjanis/components that referenced this issue May 3, 2019
@TrevorKarjanis
fix<breakpoint-observer>: fix the breakpoint observer emit count and …
7bce05f 
…accuracy

The breakpoint observer emits multiple and incorrect states when more than one query changes.
Debounce the observer emissions to eliminate the incorrect states and emit once.

References angular#10925
@TrevorKarjanis TrevorKarjanis mentioned this issue May 6, 2019
Merged
TrevorKarjanis added a commit to TrevorKarjanis/components that referenced this issue May 6, 2019
@TrevorKarjanis
fix(breakpoint-observer): fix the breakpoint observer emit count and …
72128f5 
…accuracy

The breakpoint observer emits multiple and incorrect states when more than one query changes.
Debounce the observer emissions to eliminate the incorrect states and emit once.

References angular#10925
TrevorKarjanis added a commit to TrevorKarjanis/components that referenced this issue May 7, 2019
@TrevorKarjanis
fix(breakpoint-observer): fix the breakpoint observer emit count and …
4ba5ead 
…accuracy

The breakpoint observer emits multiple and incorrect states when more than one query changes.
Debounce the observer emissions to eliminate the incorrect states and emit once.

References angular#10925
TrevorKarjanis added a commit to TrevorKarjanis/components that referenced this issue May 21, 2019
@TrevorKarjanis
fix(breakpoint-observer): fix the breakpoint observer emit count and …
68b85ed 
…accuracy

The breakpoint observer emits multiple and incorrect states when more than one query changes.
Debounce the observer emissions to eliminate the incorrect states and emit once.

References angular#10925
andrewseguin pushed a commit that referenced this issue Jun 26, 2019
@TrevorKarjanis @andrewseguin
fix(breakpoint-observer): fix the breakpoint observer emit count and …
bb66df7 
…accuracy (#15964)

The breakpoint observer emits multiple and incorrect states when more than one query changes.
Debounce the observer emissions to eliminate the incorrect states and emit once.

References #10925
andrewseguin pushed a commit that referenced this issue Jul 2, 2019
@TrevorKarjanis @andrewseguin
fix(breakpoint-observer): fix the breakpoint observer emit count and …
43b2df6 
…accuracy (#15964)

The breakpoint observer emits multiple and incorrect states when more than one query changes.
Debounce the observer emissions to eliminate the incorrect states and emit once.

References #10925
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@josephperrott josephperrott

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(breakpoints): emit only one event for adjacent breakpoint changes. josephperrott/components
3 participants
@jelbourn @emilio-martinez @josephperrott