WebUI: cr-slider change event should send value

- cr-slider has never sent the value to cr-slider-value-changed
- When cr-slider replaced paper-slider [1] as the backing for
  settings-slider it caused an empty event details to be sent
- Display zoom tries to read the value in onDisplaySizeSliderDrag_
  (display.js) [2] and gets undefined.
- This caused calculations with the zoom value to use undefined
  which resulted in displaying NaN
- Added test to cr-slider

[1] - https://chromium-review.googlesource.com/c/chromium/src/+/1362245/17/ui/webui/resources/cr_elements/cr_slider/cr_slider.js
[2] - https://cs.chromium.org/chromium/src/chrome/browser/resources/settings/device_page/display.js?q=onDisplaySizeSliderD&sq=package:chromium&g=0&l=729

BUG=chromium:932007
TEST=browser_tests --gtest-filter="CrElementsSliderTest.*"

Change-Id: Iac2fb4d63d0df09d95bdcfffd72c329afd30297b
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1652554Reviewed-by: Esmael El-Moslimany <aee@chromium.org>
Reviewed-by: May Lippert <maybelle@chromium.org>
Commit-Queue: Zentaro Kavanagh <zentaro@chromium.org>
Auto-Submit: Zentaro Kavanagh <zentaro@chromium.org>
Cr-Commit-Position: refs/heads/master@{#668495}

chrome/browser/resources/settings/device_page/display.js

@@ -719,14 +719,17 @@ Polymer({
   /**
    * Handles the event where the display size slider is being dragged, i.e. the
    * mouse or tap has not been released.
-   * @param {!Event} e
    * @private
    */
-  onDisplaySizeSliderDrag_: function(e) {
+  onDisplaySizeSliderDrag_: function() {
     if (!this.selectedDisplay) {
       return;
     }
-    this.updateLogicalResolutionText_(/** @type {number} */ (e.detail.value));
+
+    const sliderValue = this.$.displaySizeSlider.$$('#slider').value;
+    const zoomFactor = this.$.displaySizeSlider.ticks[sliderValue].value;
+    this.updateLogicalResolutionText_(
+        /** @type {number} */ (zoomFactor));
   },
 
   /**