From 6676c3b18973e0dbe78f24941acf64d28c6e37d1 Mon Sep 17 00:00:00 2001
From: Martin Geubelle <mge@odoo.com>
Date: Thu, 15 Mar 2018 16:20:23 +0100
Subject: [PATCH] [IMP] web: override size attributes in image widget

Size attributes (e.g. `max-width`) are sometimes set in css (i.e. with classes,
see `oe_avatar`).

They must however be overriden if they are specified on the widget.

Example:
  <field name="image" widget="image" class="oe_avatar" options="{'size': [180, 180]}"/>

The `max-width: 90px` set on oe_avatar must be overriden in this case.

Note that the attribute `img_width` and `img_height` have been depreciated as
`width` and `height` are fulfilling the exact same purpose.
---
 addons/web/static/src/js/fields/basic_fields.js      | 12 ++++++++++++
 addons/web/static/src/xml/base.xml                   |  4 +---
 addons/web/static/tests/fields/basic_fields_tests.js |  4 +++-
 odoo/addons/base/rng/common.rng                      |  2 --
 4 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/addons/web/static/src/js/fields/basic_fields.js b/addons/web/static/src/js/fields/basic_fields.js
index 3a5a1537387..ac005599bdb 100644
--- a/addons/web/static/src/js/fields/basic_fields.js
+++ b/addons/web/static/src/js/fields/basic_fields.js
@@ -1167,6 +1167,18 @@ var FieldBinaryImage = AbstractFieldBinary.extend({
             }
         }
         var $img = $(qweb.render("FieldBinaryImage-img", {widget: this, url: url}));
+        // override css size attributes (could have been defined in css files)
+        // if specified on the widget
+        var width = this.nodeOptions.size ? this.nodeOptions.size[0] : this.attrs.width;
+        var height = this.nodeOptions.size ? this.nodeOptions.size[1] : this.attrs.height;
+        if (width) {
+            $img.attr('width', width);
+            $img.css('max-width', width + 'px');
+        }
+        if (height) {
+            $img.attr('height', height);
+            $img.css('max-height', height + 'px');
+        }
         this.$('> img').remove();
         this.$el.prepend($img);
         $img.on('error', function () {
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index cc046a2bb89..be992c8f38a 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -885,9 +885,7 @@
     <img class="img img-responsive"
         t-att-src='url'
         t-att-border="widget.readonly ? 0 : 1"
-        t-att-name="widget.name"
-        t-att-width="widget.nodeOptions.size ? widget.nodeOptions.size[0] : widget.attrs.img_width || widget.attrs.width"
-        t-att-height="widget.nodeOptions.size ? widget.nodeOptions.size[1] : widget.attrs.img_height || widget.attrs.height"/>
+        t-att-name="widget.name"/>
 </t>
 <t t-name="FieldBinaryFile">
     <a t-if="widget.mode === 'readonly'" href="javascript:void(0)" class="o_form_uri"/>
diff --git a/addons/web/static/tests/fields/basic_fields_tests.js b/addons/web/static/tests/fields/basic_fields_tests.js
index cc041c08d7b..7a2999e18b3 100644
--- a/addons/web/static/tests/fields/basic_fields_tests.js
+++ b/addons/web/static/tests/fields/basic_fields_tests.js
@@ -1760,7 +1760,7 @@ QUnit.module('basic_fields', {
     QUnit.module('FieldImage');
 
     QUnit.test('image fields are correctly rendered', function (assert) {
-        assert.expect(6);
+        assert.expect(7);
 
         this.data.partner.records[0].__last_update = '2017-02-08 10:00:00';
         this.data.partner.records[0].document = 'myimage';
@@ -1793,6 +1793,8 @@ QUnit.module('basic_fields', {
             "the image should have the correct class");
         assert.strictEqual(form.$('div[name="document"] > img').attr('width'), "90",
             "the image should correctly set its attributes");
+        assert.strictEqual(form.$('div[name="document"] > img').css('max-width'), "90px",
+            "the image should correctly set its attributes");
         form.destroy();
 
     });
diff --git a/odoo/addons/base/rng/common.rng b/odoo/addons/base/rng/common.rng
index 2a5be15eef5..c8ffc98fe1f 100644
--- a/odoo/addons/base/rng/common.rng
+++ b/odoo/addons/base/rng/common.rng
@@ -244,8 +244,6 @@
             <rng:optional><rng:attribute name="digits"/></rng:optional>
             <rng:optional><rng:attribute name="icon"/></rng:optional>
             <rng:optional><rng:attribute name="mode"/></rng:optional>
-            <rng:optional><rng:attribute name="img_width"/></rng:optional>
-            <rng:optional><rng:attribute name="img_height"/></rng:optional>
             <rng:optional><rng:attribute name="size"/></rng:optional>
             <rng:optional><rng:attribute name="filename"/></rng:optional>
             <rng:optional><rng:attribute name="height"/></rng:optional>