[IMP] sign: makes automatic signature default

In order to make the process of signing faster, automatic mode should be the
default one. This commit implements this behavior and adds tests for it.

task-2862209

Part-of: odoo/odoo#92340

addons/web/static/src/legacy/js/widgets/name_and_signature.js

@@ -6,7 +6,6 @@ var config = require('web.config');
 var utils = require('web.utils');
 var Widget = require('web.Widget');
 
-var _t = core._t;
 
 /**
  * This widget allows the user to input his name and to draw his signature.
@@ -72,11 +71,13 @@ var NameAndSignature = Widget.extend({
         this.fontColor = options.fontColor || 'DarkBlue';
         this.displaySignatureRatio = options.displaySignatureRatio || 3.0;
         this.signatureType = options.signatureType || 'signature';
-        this.signMode = options.mode || 'draw';
+        // default mode should be auto except when noInputName is true and no default name
+        this.signMode = options.mode || (options.noInputName && !this.defaultName ? 'draw' : 'auto');
         this.noInputName = options.noInputName || false;
         this.currentFont = 0;
         this.drawTimeout = null;
         this.drawPreviewTimeout = null;
+        this.signatureAreaHidden = false;
     },
     /**
      * Loads the fonts.
@@ -143,6 +144,8 @@ var NameAndSignature = Widget.extend({
                 this.$autoButton.hide();
             }
             this.$nameInputGroup.hide();
+        } else if (this.defaultName === "") {
+            this._hideSignatureArea();
         }
 
         // Resize the signature area if it is resized
@@ -356,7 +359,7 @@ var NameAndSignature = Widget.extend({
      */
     _getCleanedName: function () {
         var text = this.getName();
-        if (this.signatureType === 'initial') {
+        if (this.signatureType === 'initial' && text) {
             return (text.split(' ').map(function (w) {
                 return w[0];
             }).join('.') + '.');
@@ -469,7 +472,7 @@ var NameAndSignature = Widget.extend({
             for (var i = 0; i < self.fonts.length; i++) {
                 var imgSrc = self._getSVGText(
                     self.fonts[i],
-                    self._getCleanedName() || _t("Your name"),
+                    self._getCleanedName(),
                     width,
                     height
                 );
@@ -501,6 +504,19 @@ var NameAndSignature = Widget.extend({
         return def;
     },
 
+    _hideSignatureArea: function () {
+        this.$signatureField.hide();
+        this.$signatureGroup.hide();
+        this.signatureAreaHidden = true;
+    },
+
+    _showSignatureArea: function () {
+        this.$signatureField.show();
+        this.$signatureGroup.show();
+        this.signatureAreaHidden = false;
+        this.resetSignature();
+    },
+
     //----------------------------------------------------------------------
     // Handlers
     //----------------------------------------------------------------------
@@ -632,6 +648,9 @@ var NameAndSignature = Widget.extend({
      * @param {Event} ev
      */
     _onInputSignName: function (ev) {
+        if (this.signatureAreaHidden && this._getCleanedName()) {
+            this._showSignatureArea();
+        }
         if (this.signMode !== 'auto') {
             return;
         }

addons/web/static/src/legacy/xml/name_and_signature.xml

@@ -41,7 +41,7 @@
         <div class="o_web_sign_name_and_signature">
             <div class="o_web_sign_name_group form-group">
                 <label class="col-form-label" t-att-for="'o_web_sign_name_input_' + widget.htmlId">Full Name</label>
-                <input type="text" name="signer" t-att-id="'o_web_sign_name_input_' + widget.htmlId" class="o_web_sign_name_input form-control" t-att-value="widget.defaultName" placeholder="Your name" required=""/>
+                <input type="text" name="signer" t-att-id="'o_web_sign_name_input_' + widget.htmlId" class="o_web_sign_name_input form-control" t-att-value="widget.defaultName" placeholder="Type your name to sign" required=""/>
             </div>
 
             <!--
@@ -53,13 +53,13 @@
                 <div class="card-header">
                     <div class="row no-gutters">
                         <div class="col-auto">
-                            <a role="button" href="#" t-attf-class="o_web_sign_draw_button mr-2 btn btn-light {{ widget.signMode === 'draw' ? 'active': '' }}">
-                                Draw
+                            <a role="button" href="#" t-attf-class="o_web_sign_auto_button mr-2 btn btn-light {{ widget.signMode === 'auto' ? 'active': '' }}">
+                                Auto
                             </a>
                         </div>
                         <div class="col-auto">
-                            <a role="button" href="#" t-attf-class="o_web_sign_auto_button mr-2 btn btn-light {{ widget.signMode === 'auto' ? 'active': '' }}">
-                                Auto
+                            <a role="button" href="#" t-attf-class="o_web_sign_draw_button mr-2 btn btn-light {{ widget.signMode === 'draw' ? 'active': '' }}">
+                                Draw
                             </a>
                         </div>
                         <div class="col-auto">

addons/web/static/tests/legacy/widgets/name_and_signature_tests.js

@@ -0,0 +1,80 @@
+odoo.define('web.name_and_signature_tests', function (require) {
+    "use strict";
+
+    const { NameAndSignature } = require("web.name_and_signature");
+    const testUtils = require("web.test_utils");
+    const MockedNameAndSignature = NameAndSignature.extend({
+        events: {
+            ...NameAndSignature.prototype.events,
+            'signature_changed': () => {},
+        },
+        _onChangeSignature: () => {},
+        _drawCurrentName: () => {},
+    });
+
+    async function MockedNameAndSignatureGenerator (options) {
+        const parent = $("#qunit-fixture");
+        const mockedNameAndSignature = new MockedNameAndSignature(parent, options);
+        await testUtils.mock.addMockEnvironment(mockedNameAndSignature, {
+            mockRPC: function (route, args) {
+                if (route == "/web/sign/get_fonts/") {
+                    return Promise.resolve();
+                }
+            }
+        });
+        await mockedNameAndSignature.appendTo(parent);
+        await mockedNameAndSignature.resetSignature();
+        return mockedNameAndSignature;
+    }
+
+    QUnit.module('widgets', {}, function () {
+        QUnit.module('name_and_signature', {
+            beforeEach: function () {
+                this.defaultName = 'Don Toliver'
+            },
+        }, function () {
+            QUnit.test("test name_and_signature widget", async function (assert) {
+                assert.expect(5);
+                const nameAndSignature = await MockedNameAndSignatureGenerator({
+                    defaultName: this.defaultName
+                });
+                assert.equal(nameAndSignature.signMode, 'auto');
+                const nameInput = nameAndSignature.$el.find('.o_web_sign_name_input');
+                assert.ok(nameInput.length);
+                assert.equal(this.defaultName, nameInput.val());
+                const drawButton = nameAndSignature.$el.find('.o_web_sign_draw_button');
+                assert.ok(drawButton.length);
+                await drawButton.click();
+                assert.equal(nameAndSignature.signMode, 'draw');
+            });
+
+            QUnit.test("test name_and_signature widget without name", async function (assert) {
+                assert.expect(4);
+                const nameAndSignature = await MockedNameAndSignatureGenerator({});
+                assert.equal(nameAndSignature.signMode, 'auto');
+                assert.ok(nameAndSignature.signatureAreaHidden);
+                const nameInput = nameAndSignature.$el.find('.o_web_sign_name_input');
+                assert.ok(nameInput.length);
+                await nameInput.val(this.defaultName).trigger('input');
+                assert.notOk(nameAndSignature.signatureAreaHidden);
+            });
+
+            QUnit.test("test name_and_signature widget with noInputName and default name", async function (assert) {
+                assert.expect(1);
+                const nameAndSignature = await MockedNameAndSignatureGenerator({
+                    noInputName: true,
+                    defaultName: this.defaultName
+                });
+                assert.equal(nameAndSignature.signMode, 'auto');
+            });
+
+            QUnit.test("test name_and_signature widget with noInputName", async function (assert) {
+                assert.expect(1);
+                const nameAndSignature = await MockedNameAndSignatureGenerator({
+                    noInputName: true,
+                });
+                assert.equal(nameAndSignature.signMode, 'draw');
+            });
+        });
+    });
+});