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.

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

Color Picker does not Update on First Change #186

Open
jordandh opened this issue Nov 17, 2020 · 1 comment
Open

Color Picker does not Update on First Change #186

jordandh opened this issue Nov 17, 2020 · 1 comment

Comments

@jordandh
Copy link

Describe the bug
When the color picker's initial selectedColor value is the emptyColor then the first color selected is not set.

I believe the fix is quite easy but haven't been able to test it myself. Just a couple of changes in projects/material-community-components/color-picker/color-picker-selector.component.ts. When the user clicks on the color palette the changeColor is called and it emits a new value this._tmpSelectedColor.next(color);. That triggers the subscription in ngOnInit to be called where it does a check to see if there is a color if (this.noColor) {. The problem is that changeColor does not change this.noColor to be false until after it emits on this._tmpSelectedColor.

changeColor() {
  ...
  this._tmpSelectedColor.next(color);
  this.noColor = false;
  ...
}

I think this.noColor needs to be set to false before emitting on this._tmpSelectedColor. I found two places that need to change:
image

To Reproduce
Steps to reproduce the behavior:

  1. Go to a color picker with the selected color set equal to the empty color
  2. Open the color picker
  3. Click in the color palette
  4. Notice that the color is not selected

Expected behavior
I expect the color to change on the first selection.

Screenshots
color-picker-no-change-on-first-click

Desktop (please complete the following information):

  • OS: MacOS 11.0.1
  • Browser Chrome 86.0.4240.198

Additional context
I tried to make the fix myself in order to make a PR. But I've been having a lot of trouble getting the library to run in my own Angular app locally. I suspect this to be due to the new way libraries are built with Ivy. If you have any pointers on how to get this working I would love to be able to open new PRs in the future with any fixes I can make.

@motabass
Copy link
Contributor

Hi. You may either link the locally built library with npm link or try use the demo app for development. I hope this helps

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants