[FIX] web: correctly display filename when uploading a file

Before this commit, we had the following issue with binary widget in a form:

Suppose we have a binary field with filename attribute set. When uploading a
new file 'temp.txt' with content 'Cg==', the displayed value is 'Cg=='. When
the changes are saved, the displayed value becomes 'temp.txt'.

It should always display 'temp.txt', which is what is fixed by this commit.

In addition to fixing this issue, we describe what is the expected displayed
value of a binary field. This is based on whether the attribute filename is
provided, and whether the record is in edit or read-only mode.

Fixes #21630
Closes #24275

Co-authored-by: Nick Booker <nick.booker@opusvl.com>

1 files changed, 35 insertions, 1 deletions

diff --git a/addons/web/static/src/js/views/form_widgets.js b/addons/web/static/src/js/views/form_widgets.js
index fe1cc32955e..b99732774f2 100644
--- a/addons/web/static/src/js/views/form_widgets.js
+++ b/addons/web/static/src/js/views/form_widgets.js
@@ -1189,9 +1189,40 @@ var FieldBinaryFile = FieldBinary.extend({
             });
         }
     },
+    /**
+     * Render the value of the binary file field
+     *
+     * The value depends on the mode (readonly/edit) and the attribute filename
+     * in the xml node of the field:
+     *
+     *
+     *              with filename       without filename
+     *           [------------------|-----------------------]
+     * readonly: |  saved filename  |      binary size      |
+     *     edit: | current filename | base64 representation |
+     *           [------------------|-----------------------]
+     *
+     *
+     * This is how the filename is retrieved:
+     *
+     *   - Suppose that the binary field is named 'data'
+     *   - The xml node of this field is as follow:
+     *
+     *        `<field name='data' filename='fdata'/>`
+     *
+     *   - 'fdata' is another field whose value is the filename
+     *   - On the following record:
+     *
+     *          `{data: "Cg==1das02fa01", fdata: 'my-file.txt'}`
+     *
+     *   - The content of the file is the value of 'data': Cg==1das02fa01
+     *   - The filename is the value of 'fdata': my-file.txt
+     */
     render_value: function() {
-        var filename = this.view.datarecord[this.node.attrs.filename];
+        var filename;
         if (this.get("effective_readonly")) {
+            // Filename from saved state (might render from a discard operation)
+            filename = this.view.datarecord[this.node.attrs.filename]; // do not forward-port >= 11.0
             this.do_toggle(!!this.get('value'));
             if (this.get('value')) {
                 this.$el.empty().append($("<span/>").addClass('fa fa-download'));
@@ -1205,6 +1236,9 @@ var FieldBinaryFile = FieldBinary.extend({
                 }
             }
         } else {
+            // Filename at the moment (might be unsaved state)
+            var filenameField = this.field_manager.fields[this.node.attrs.filename]; // do not forward-port >= 11.0
+            filename = filenameField ? filenameField.get('value') : '';
             if(this.get('value')) {
                 this.$el.children().removeClass('o_hidden');
                 this.$('.o_select_file_button').first().addClass('o_hidden');