Colorpicker doesn't work in Firefox

[burakkilic]

Hi;

I am using the code below:

<div class="col-md-10">
      <div class="input-group color colorpicker-default">
                                    <input colorpicker colorpicker-with-input="true" type="text" ng-model="option.value" class="form-control" />
                                    <span colorpicker ng-model="option.value" class="input-group-btn" style="background-color: {{option.value}}; width:20px;"></span>
                                </div>
                            </div>

In chrome, I can select colors from color-picker, but in Firefox, I cannot.

CSS and js files are loaded. Where am I wrong?

[buberdds]

hey can you download the latest version? Bugfix was released today, so maybe this case is already resolved.

[burakkilic]

I have 3.0.16. Which is the latest version?

[buberdds]

yep that is the latest version. I tested your example and it is working in FF, any more details?

[burakkilic]

Maybe it is because of the scripts include locations. I included:

  <link href="assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="lib/angular-bootstrap-colorpicker/css/colorpicker.min.css" rel="stylesheet" type="text/css" />

css like this. And js:
<script src="lib/angular-bootstrap-colorpicker/js/bootstrap-colorpicker-module.js"></script>

between the head tags.

[buberdds]

I don't think so it's the case. can you upload your example somewhere? or create a codepen?

[PeterTim]

I've reproduced the problem in FF with bootstrap-colorpicker-module.min.js. bootstrap-colorpicker-module.js works well.

[burakkilic]

Interesting. I'm using "lib/angular-bootstrap-colorpicker/js/bootstrap-colorpicker-module.js" but still has problem.

[buberdds]

thanks @PeterTim, I forgot to run build after last PR, file updated

[SixiangChen]

I met the same problem in FF today.
Just copied the simplest color picker from CodePen

  <div class="col-md-5">
  <input colorpicker ng-model="hexPicker.color" type="text">
  </div>

I am using the latest js file and it works fine in Chrome. But in FF, wherever I clicked inside the sliderSaturation, the color stuck to #000000.

Any idea what might happened?

Thanks!

[llattes]

Submitted a PR with a possible fix for Firefox (Tested in FF 37.0.2). Feature still works in other major browsers.

[SixiangChen]

It works. Thanks @llattes
-Tested in FF 37.0.2 and other browsers(Safari Opera Chrome)

[llattes]

@Angel-AOL I submitted a new PR (#95) that does not depend on jQuery to do the trick. It should work like the previously suggested fix.

[buberdds]

Hey, #95 looks good for me in general, but I couldn't reproduce this bug in FF. @Angel-AOL can you confirm that #95 is OK? thanks

[SixiangChen]

@llattes @buberdds
I overwrote previous bootstrap-colorpicker-module.js with the new .js file to do the test. The bug re-appeared. Same as I described before. in FF 37.0.2.