fix(Dropdown): use placeholder as default text

[eyas2014]

Fixes #3581.

---

We should always display some text in div.text because SUI does the same thing: https://semantic-ui.com/modules/dropdown.html Actually, this is also an answer why we don't have any unit tests for this behavior.

SUI has styles that will prevent visibility off div.text:

[welcome]

💖 Thanks for opening this pull request! 💖

Here is a list of things that will help get it across the finish line:

• Run yarn lint locally to catch formatting errors. This will fix some errors automatically, commit and push any changes.
• Run yarn test locally to catch errors. This ensures all components still behave as they should.
• Run yarn start to run the doc site locally and try a few pages, ensuring everything is in good working order.
• Include tests when adding/changing behavior.

We get a lot of pull requests on this repo, so please be patient and we will get back to you as soon as we can.

[codecov-io]

Codecov Report

Merging #3586 into master will decrease coverage by <.01%.
The diff coverage is 100%.

@@            Coverage Diff             @@
##           master    #3586      +/-   ##
==========================================
- Coverage   99.83%   99.83%   -0.01%     
==========================================
  Files         174      174              
  Lines        3105     3103       -2     
==========================================
- Hits         3100     3098       -2     
  Misses          5        5

Impacted Files	Coverage Δ
src/modules/Dropdown/Dropdown.js	100% <100%> (ø)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update f8e894c...1a15b4e. Read the comment docs.

[layershifter]

Sorry for the late feedback. I want to check this change additionally because it was not covered by unit tests before 😮

[mattgd]

Hi @layershifter! Any word on this PR? Is there anything I might be able to do to help with testing to expedite this?

[layershifter]

@mattgd @eyas2014 thank you for contributions and follow ups 👍

I checked this issue deeply and value was invisible because we haven't render any text, so @eyas2014 provided a correct fix ⭐️ But, we should render a placeholder instead of searchQuery by default as SUI does:

  <div class="ui floating dropdown labeled search button icon active visible">
    <input class="search" autocomplete="off" tabindex="0" value="VALUE" />
    <span class="text filtered">PLACEHOLDER</span>
  </div>

https://codesandbox.io/s/semantic-ui-react-example-55i18

[layershifter]

SUI renders text always and has styles to make it invisible 🐙

[welcome]

Congrats on merging your first pull request! 🎉🎉🎉