fix: Add copy button in input fields

[pateldivyesh1323]

Description

Add copy button on hover in text area

Fixes #24

Video

CEL.Playground.-.Google.Chrome.2023-10-26.17-39-08.mp4

Checklist

• I have labeled this PR with the relevant Type labels
• I have documented my code (if applicable)
• My changes are covered by tests

[joaovictor3g]

Hi @pateldivyesh1323 I was testing your changes and I got those errors.

They happen because the Clipboard API only works in secure context as this article says, probably in production environment it will work properly. Even though, as a suggestion in not secure environments a fallback can be provided to make clear why the copy is not working.

[pateldivyesh1323]

Hi @joaovictor3g can you tell me how to reproduce it or how you tested it, and more about fallback which you are suggesting.

[joaovictor3g]

Hi @pateldivyesh1323 i have tested in my local environment running make serve, i am using chrome but the error behavior happened in firefox too. Basically the Clipboard API does not work outside HTTPS certificate. And about the fallback a simple console.error must solve it.

[pateldivyesh1323]

@joaovictor3g

   navigator.clipboard.writeText(value).catch(console.error);

like this?

yes it does not usually work on http, but I cant reproduce it although I am using chrome

[joaovictor3g]

@pateldivyesh1323 yes, like that, can you please commit it?

[pateldivyesh1323]

@joaovictor3g Done.

[joaovictor3g]

@pateldivyesh1323 thank you very much for your contribution and collaboration.
We really appreciate it.