Question: [![enter image description here](https://i.stack.imgur.com/nTAd8.png)](https://i.stack.imgur.com/nTAd8.png)

Scenario: 
Choose color, enter other details and save.
when I click on the html element color (input type=color) it opens a color picker which is a window pop\_up. 

```
<input type="color" class="form-control ng-pristine ng-valid ng-empty ng-touched" style="width: 70%;" ng-model="modalData[0].StrokeColor" placeholder="color" aria-invalid="false">

```

this is the html element for me. 

The default value is null for the element. Without picking the color i cant save this form.
i tried using js command to set the value for the element.

```
document.getElementsByClassName('form-control ng-valid ng-touched ng-not-empty ng-dirty ng-valid-parse')[0].setAttribute('value', '#32CD32')

```

this changes the value fo the color but has no impact on either the UI or the save.

how can i handle this, i am not good with scite script. any help.
Thanks.

Answer: 
Try below code

```
JavascriptExecutor js = (JavascriptExecutor) w;
WebElement ColorElement =w.findElement(By.cssSelector("input[type='color']"));
js.executeScript("arguments[0].setAttribute('value', '#FF0000')",ColorElement);

```
For me simply calling `.sendKeys('#FF0000')` on the web element worked with Selenium 4 + Chrome.