fix(VSlider): use a text input internally

firefox sliders don't play well with the css reset

fixes #4464

Author: KaelWD

src/components/VSlider/VSlider.js

@@ -233,13 +233,13 @@ export default {
       return children
     },
     genListeners () {
-      return Object.assign({}, {
+      return {
         blur: this.onBlur,
         click: this.onSliderClick,
         focus: this.onFocus,
         keydown: this.onKeyDown,
         keyup: this.onKeyUp
-      })
+      }
     },
     genInput () {
       return this.$createElement('input', {
@@ -248,7 +248,6 @@ export default {
           name: this.name,
           role: 'slider',
           tabindex: this.disabled ? -1 : this.$attrs.tabindex,
-          type: 'range',
           value: this.internalValue,
           readonly: true,
           'aria-readonly': String(this.readonly)

test/unit/components/VSlider/__snapshots__/VSlider.spec.js.snap

@@ -7,7 +7,6 @@ exports[`VSlider.vue should change track styles in rtl 1`] = `
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"
@@ -46,7 +45,6 @@ exports[`VSlider.vue should change track styles in rtl 2`] = `
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="50"
                readonly="readonly"
                aria-readonly="false"
@@ -85,7 +83,6 @@ exports[`VSlider.vue should change track styles in rtl 3`] = `
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="50"
                readonly="readonly"
                aria-readonly="false"
@@ -125,7 +122,6 @@ exports[`VSlider.vue should change track styles in rtl 4`] = `
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"
@@ -164,7 +160,6 @@ exports[`VSlider.vue should change track styles in rtl 5`] = `
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="50"
                readonly="readonly"
                aria-readonly="false"
@@ -203,7 +198,6 @@ exports[`VSlider.vue should change track styles in rtl 6`] = `
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="50"
                readonly="readonly"
                aria-readonly="false"
@@ -243,7 +237,6 @@ exports[`VSlider.vue should match a snapshot 1`] = `
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"
@@ -282,7 +275,6 @@ exports[`VSlider.vue should render component with thumbLabel and match a snapsho
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"
@@ -332,7 +324,6 @@ exports[`VSlider.vue should render component with thumbLabel and match a snapsho
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"
@@ -382,7 +373,6 @@ exports[`VSlider.vue should render component with ticks and match a snapshot 1`]
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"
@@ -443,7 +433,6 @@ exports[`VSlider.vue should render component with ticks and match a snapshot 2`]
     <div class="v-input__slot">
       <div class="v-slider">
         <input role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"
@@ -511,7 +500,6 @@ exports[`VSlider.vue should reverse label location when inverse 1`] = `
       <div class="v-slider">
         <input aria-label="foo"
                role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"
@@ -551,7 +539,6 @@ exports[`VSlider.vue should reverse label location when inverse 2`] = `
       <div class="v-slider">
         <input aria-label="foo"
                role="slider"
-               type="range"
                value="0"
                readonly="readonly"
                aria-readonly="false"