popup-menu-appearance-custom-scrollbar-track-hover.html

<!DOCTYPE html>
<meta name=fuzzy content="maxDifference=0-3; totalPixels=0-100">
<script src="../../../resources/testdriver.js"></script>
<script src="../../../resources/testdriver-vendor.js"></script>
<script src="../resources/picker-common.js"></script>

<style>
  select:focus {
    outline-width: 0;
  }
  select {
    width: 200px;
    font: 10px Ahem;
    -webkit-appearance: none;
    background-color: white;
  }
  select::-webkit-scrollbar {
    width: 200px;
  }
  select::-webkit-scrollbar-track {
    background: orange;
  }
  select::-webkit-scrollbar-corner {
    background: yellow;
  }

  select::-webkit-scrollbar-thumb {
    background: gray;
  }
  select::-webkit-scrollbar-track:hover {
    background: green;
  }
  option:hover{
    background-color: green;
  }
</style>

<select>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
</select>

<script>
  window.onload = () => {
    let menu = document.querySelector('select');
    openPickerAppearanceOnly(menu,() => {
      return new Promise(function(resolve, reject) {
        if (window.chrome && chrome.gpuBenchmarking) {
          let selectElement = internals.pagePopupWindow.global.picker.selectElement_;
          let innerSelectRect = selectElement.getBoundingClientRect();
          let scrollbarX = innerSelectRect.x + innerSelectRect.width - 5;
          let scrollbarY = innerSelectRect.y + innerSelectRect.height - 10;
          chrome.gpuBenchmarking.pointerActionSequence(
              [{
                source: 'mouse',
                actions: [{name: 'pointerMove', x: scrollbarX, y: scrollbarY}]
              }],
              resolve);
        } else {
          reject();
        }
      });
    });
  };
</script>
chromium/third_party/blink/web_tests/fast/forms/select-popup/popup-menu-appearance-custom-scrollbar-track-hover.html
