Moved back to data-wd-key approach and fixed tests

src/components/inputs/NumberInput.jsx

@@ -108,13 +108,6 @@ class NumberInput extends React.Component {
   }
 
   render() {
-    let wdProps = {};
-    if (this.props.wdKey) {
-      wdProps = {
-        "data-wd-key": this.props.wdKey
-      };
-    }
-
     if(
       this.props.hasOwnProperty("min") && this.props.hasOwnProperty("max") &&
       this.props.min !== undefined && this.props.max !== undefined &&
@@ -146,6 +139,7 @@ class NumberInput extends React.Component {
         />
         <input
           key="text"
+          type="text"
           spellCheck="false"
           className="maputnik-number"
           placeholder={this.props.default}
@@ -154,7 +148,6 @@ class NumberInput extends React.Component {
             this.changeValue(e.target.value)
           }}
           onBlur={this.resetValue}
-          {...wdProps}
         />
       </div>
     }
@@ -162,13 +155,13 @@ class NumberInput extends React.Component {
       return <div className="maputnik-number-container">
         <input
           key="text"
+          type="text"
           spellCheck="false"
           className="maputnik-number"
           placeholder={this.props.default}
           value={this.state.value}
           onChange={e => this.changeValue(e.target.value)}
           onBlur={this.resetValue}
-          {...wdProps}
         />
       </div>
     }

src/components/layers/MaxZoomBlock.jsx

@@ -12,9 +12,10 @@ class MaxZoomBlock extends React.Component {
   }
 
   render() {
-    return <InputBlock label={"Max Zoom"} doc={latest.layer.maxzoom.doc}>
+    return <InputBlock label={"Max Zoom"} doc={latest.layer.maxzoom.doc}
+      data-wd-key="max-zoom"
+    >
       <NumberInput
-        wdKey="max-zoom"
         allowRange={true}
         value={this.props.value}
         onChange={this.props.onChange}

src/components/layers/MinZoomBlock.jsx

@@ -12,9 +12,10 @@ class MinZoomBlock extends React.Component {
   }
 
   render() {
-    return <InputBlock label={"Min Zoom"} doc={latest.layer.minzoom.doc}>
+    return <InputBlock label={"Min Zoom"} doc={latest.layer.minzoom.doc}
+      data-wd-key="min-zoom"
+    >
       <NumberInput
-        wdKey="min-zoom"
         allowRange={true}
         value={this.props.value}
         onChange={this.props.onChange}

test/functional/layers/index.js

@@ -191,7 +191,7 @@ describe("layers", function() {
           var bgId = createBackground();
 
           browser.click(wd.$("layer-list-item:background:"+bgId))
-          browser.setValueSafe(wd.$("min-zoom", "input"), 1)
+          browser.setValueSafe(wd.$("min-zoom", 'input[type="text"]'), 1)
           browser.click(wd.$("layer-editor.layer-id", "input"));
 
           var styleObj = helper.getStyleStore(browser);
@@ -221,7 +221,7 @@ describe("layers", function() {
           var bgId = createBackground();
 
           browser.click(wd.$("layer-list-item:background:"+bgId))
-          browser.setValueSafe(wd.$("max-zoom", "input"), 1)
+          browser.setValueSafe(wd.$("max-zoom", 'input[type="text"]'), 1)
           browser.click(wd.$("layer-editor.layer-id", "input"));
 
           var styleObj = helper.getStyleStore(browser);