#9363 Wrong scale value reported using the scroll wheel (#9401) (#9440)

geosolutions-it · Sep 14, 2023 · f22fecb · f22fecb
1 parent b769c90
commit f22fecb
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/web/client/components/mapcontrols/scale/ScaleBox.jsx b/web/client/components/mapcontrols/scale/ScaleBox.jsx
@@ -45,7 +45,7 @@ class ScaleBox extends React.Component {
     }
 
     onComboChange = (event) => {
-        var selectedZoomLvl = parseInt(event.nativeEvent.target.value, 10);
+        let selectedZoomLvl = parseInt(event.nativeEvent.target.value, 10);
         this.props.onChange(selectedZoomLvl, this.props.scales[selectedZoomLvl]);
     };
 
@@ -58,22 +58,23 @@ class ScaleBox extends React.Component {
     };
 
     render() {
-        var control = null;
+        let control = null;
+        const currentZoomLvl = Math.round(this.props.currentZoomLvl);
         if (this.props.readOnly) {
             control =
-                <label>{this.props.template(this.props.scales[this.props.currentZoomLvl], this.props.currentZoomLvl)}</label>
+                <label>{this.props.template(this.props.scales[currentZoomLvl], currentZoomLvl)}</label>
             ;
         } else if (this.props.useRawInput) {
             control =
-                (<select label={this.props.label} onChange={this.onComboChange} bsSize="small" value={this.props.currentZoomLvl || ""}>
+                (<select label={this.props.label} onChange={this.onComboChange} bsSize="small" value={currentZoomLvl || ""}>
                     {this.getOptions()}
                 </select>)
             ;
         } else {
             control =
                 (<Form inline><FormGroup bsSize="small">
                     <ControlLabel>{this.props.label}</ControlLabel>
-                    <FormControl componentClass="select" onChange={this.onComboChange} value={this.props.currentZoomLvl || ""}>
+                    <FormControl componentClass="select" onChange={this.onComboChange} value={currentZoomLvl || ""}>
                         {this.getOptions()}
                     </FormControl>
                 </FormGroup></Form>)

diff --git a/web/client/components/mapcontrols/scale/__tests__/ScaleBox-test.jsx b/web/client/components/mapcontrols/scale/__tests__/ScaleBox-test.jsx
@@ -96,4 +96,10 @@ describe('ScaleBox', () => {
         expect(domLabel).toExist();
         expect(domLabel.innerHTML).toContain("Scale:");
     });
+
+    it('should support not rounded zoom levels', () => {
+        TestUtils.act(() => { ReactDOM.render(<ScaleBox currentZoomLvl={5.1}/>, document.getElementById('container')); });
+        const select = document.querySelector('select');
+        expect(select.value).toBe('5');
+    });
 });