Bugfix: Clicking above number input's increment button displays click
of decrement button

The spinbutton is a single element (derives from HTMLDivElement) that
can be used to spin a value up or down.  Because its implemented as a
single element, but actually behaves like (and is painted as) two
scrollbar buttons stacked on top of each other, it has state
(up_down_state_) in addition to the normal hover and active flags to
determine which half of the spin button the hover and active flags
apply to.

The painting code for spinbutton uses the extra state like so:
if (active) {
  if (up) {
    // paint active state for up
  else {
    // paint active state for down

The code shown above isn't a problem so long as all active (or hover)
states are either up or down.  Because of some pixel snapped checks in
the spinbutton code, however, sometimes the up_down_state_ was set to
indeterminate while the spinbutton was still tagged as active or
hovered.  That's an error state.  If the spinbutton is hovered or
active, it should always indicate which side.

To fix the up_down_state_/hover/active misalignment bugs, all the
checks testing for whether the spinbutton contains the mouse events
delivered to it have been removed.  Mousedown/up/move events (excluding
when the mouse is explicitly captured) are only delivered to the
spinbutton element when they are over the spinbutton element - so the
checks in the current code were redundant in addition to being a source
of bugs.

Because the up_down_state_ is only used to influence painting and value
spinning while the spinbutton is in the hover or active states, it
makes the indeterminate value unnecessary - so it was removed as well
which simplifies some of the themeing code.

This fix also increases the touch-ability of the SpinButtonElement as
we can now press the up/down arrow, and drag our choice to the opposite
corresponding arrow, and the number input behaves as you would expect,
incrementing or decrementing as needed.

Bug: 419108
Change-Id: I9d25da6f2e553035076f1a85e786a5bf5be80aad
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2163034
Commit-Queue: Sam Sebree <sasebree@microsoft.com>
Reviewed-by: Mason Freed <masonfreed@chromium.org>
Reviewed-by: Kent Tamura <tkent@chromium.org>
Cr-Commit-Position: refs/heads/master@{#765569}
6 files changed
tree: 471fc61ca432b73b21f648ab7b783cee8206ea70
  1. android_webview/
  2. apps/
  3. ash/
  4. base/
  5. build/
  6. build_overrides/
  7. buildtools/
  8. cc/
  9. chrome/
  10. chromecast/
  11. chromeos/
  12. cloud_print/
  13. components/
  14. content/
  15. courgette/
  16. crypto/
  17. dbus/
  18. device/
  19. docs/
  20. extensions/
  21. fuchsia/
  22. gin/
  23. google_apis/
  24. google_update/
  25. gpu/
  26. headless/
  27. infra/
  28. ios/
  29. ipc/
  30. jingle/
  31. media/
  32. mojo/
  33. native_client_sdk/
  34. net/
  35. pdf/
  36. ppapi/
  37. printing/
  38. remoting/
  39. rlz/
  40. sandbox/
  41. services/
  42. skia/
  43. sql/
  44. storage/
  45. styleguide/
  46. testing/
  47. third_party/
  48. tools/
  49. ui/
  50. url/
  51. weblayer/
  52. .clang-format
  53. .clang-tidy
  54. .eslintrc.js
  55. .git-blame-ignore-revs
  56. .gitattributes
  57. .gitignore
  58. .gn
  59. .vpython
  60. .vpython3
  61. .yapfignore
  63. BUILD.gn
  65. codereview.settings
  66. DEPS
  69. LICENSE.chromium_os
  70. OWNERS
  71. PRESUBMIT.py
  72. PRESUBMIT_test.py
  73. PRESUBMIT_test_mocks.py
  74. README.md

Logo Chromium

Chromium is an open-source browser project that aims to build a safer, faster, and more stable way for all users to experience the web.

The project's web site is https://www.chromium.org.

Documentation in the source is rooted in docs/README.md.

Learn how to Get Around the Chromium Source Code Directory Structure .

For historical reasons, there are some small top level directories. Now the guidance is that new top level directories are for product (e.g. Chrome, Android WebView, Ash). Even if these products have multiple executables, the code should be in subdirectories of the product.