Prerequisites
- [ x] I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
- [x ] The issue still exists against the latest stable version of Elementor.
Description
-
When attempting to type a new hex value into the color picker in any widget, column or section, auto complete replaces with #000000
-
With cursor at end of hex value, cant backspace to delete existing value in order to type in new one. Auto complete replaces with #000000
Steps to reproduce
Step 1: open color picker for the first time in any widget, column or section
Step 2: attempt to type a hex code into the field, either with or without a #
Step 3: notice that a 6-digit hex is immediately inserted into the field with your insertion point placed at the end of it, and the characters you are currently typing are appended to the end resulting in some random variation or gradation of that color.
Step 4: use the clear button to clear the unwanted color, then reenter your color, which this time works as expected.
Step 5: click outside the color picker to close it
Step 6: open the color picker again and repeat Step 2 and 3
Other Related issues:
Step 7: use the backspace key to delete an existing hex color and notice how some (seemingly) random color gets added to the widget, column or section despite none being selected in the color picker.
Step 8: choose a color from the saved swatches at the top of the color picker and notice how no hex number is added to the field, thus giving no way to delete or edit the color.
Step 9: close the color picker and reopen, attempt to use backspace to delete the existing color and notice how auto complete again inserts a 6 digit hex, and prevents you from deleting it.
For me (using Chrome), this is consistently repeatable by simple closing and reopening the color picker.
In short, this color picker is a ridiculous mess. The UI is terrible, practically unusable.
Isolating the problem
- [x ] This bug happens with only Elementor plugin active (and Elementor Pro).
- [ x] This bug happens with a default WordPress theme active.
- [x ] I can reproduce this bug consistently using the steps above.
Prerequisites
Description
When attempting to type a new hex value into the color picker in any widget, column or section, auto complete replaces with #000000
With cursor at end of hex value, cant backspace to delete existing value in order to type in new one. Auto complete replaces with #000000
Steps to reproduce
Step 1: open color picker for the first time in any widget, column or section
Step 2: attempt to type a hex code into the field, either with or without a #
Step 3: notice that a 6-digit hex is immediately inserted into the field with your insertion point placed at the end of it, and the characters you are currently typing are appended to the end resulting in some random variation or gradation of that color.
Step 4: use the clear button to clear the unwanted color, then reenter your color, which this time works as expected.
Step 5: click outside the color picker to close it
Step 6: open the color picker again and repeat Step 2 and 3
Other Related issues:
Step 7: use the backspace key to delete an existing hex color and notice how some (seemingly) random color gets added to the widget, column or section despite none being selected in the color picker.
Step 8: choose a color from the saved swatches at the top of the color picker and notice how no hex number is added to the field, thus giving no way to delete or edit the color.
Step 9: close the color picker and reopen, attempt to use backspace to delete the existing color and notice how auto complete again inserts a 6 digit hex, and prevents you from deleting it.
For me (using Chrome), this is consistently repeatable by simple closing and reopening the color picker.
In short, this color picker is a ridiculous mess. The UI is terrible, practically unusable.
Isolating the problem