Toolbar select labels default to hard-coded values when the focus leaves the editor

[jasongisstl]

If you create custom 'select' lists in the toolbar, when the focus leaves the editor the select label reverts to 'hard-coded' values.

E.g. If you have a custom list of fonts, when the focus leaves the editor the font name will be displayed as 'Sans-Serif', even if this is not present in your list of fonts.

Steps for Reproduction

1. Visit http://codepen.io/jasongiss/pen/NRKbQW - it creates custom select lists for the font and font size.
2. Give the editor the focus - note that the Font & Size are set to 'Font 2' & 'Mini' respectively.
3. Click outside the editor - the Font & Size become 'Sans-Serif' and 'Normal'

Expected behavior: The originally 'selected' option should be displayed by default when the editor loses focus.

Actual behavior: Quill's standard default options are displayed when the editor loses focus.

Platforms: Chrome 52 on Mac 10.11.6

Version: 1.0.0-rc3

[jasongisstl]

I have a feeling that perhaps I am taking the wrong approach to creating these 'custom' lists?

The font lists in this example is working only through the coincidence that the values I have used (serif & monospace) match the values used for the fonts in quill.snow.css.
E.g. If I wanted a font to map to "Verdana, Arial, Helvetica, sans-serif", this would not work.

Should it? Or is there another way to do this?
This sort of approach used to work in v0.2 - perhaps it no longer does by design?
I have been unable to find docs on this.

[jhchen]

Your approach is correct. The workaround right now is to define a custom css rule that sets the default value to your custom default value.

[tomph]

Hi guys.

Could you give me an example of this custom css rule JHChen? I'm struggling to get this behaviour with a custom drop down...

[tomph]

I'm still seeing this issue (even in the Playground).

To re-create, do the following:

1. Type a word
2. Set Heading Type to Heading 2
3. Click back into editor and focus on word
4. Click on the Headings dropdown (it displays the default, not the selected value)