diff --git a/admin/templates/setting_configpasswordunmask.mustache b/admin/templates/setting_configpasswordunmask.mustache
index cf7565c1932..8cb2d661ae4 100644
--- a/admin/templates/setting_configpasswordunmask.mustache
+++ b/admin/templates/setting_configpasswordunmask.mustache
@@ -35,35 +35,25 @@
 }}
 <div class="form-password">
     <span data-passwordunmask="wrapper" data-passwordunmaskid="{{ id }}">
-        <span class="visibleifjs">
-            <span data-passwordunmask="editor">
-                <input  type="hidden"
-                        name="{{ name }}"
-                        id="{{ id }}"
-                        value="{{ value }}"
-                        size="{{ size }}"
-                        >
-            </span>
-            <a href="#" data-passwordunmask="edit" title="{{ edithint }}">
-                <span data-passwordunmask="displayvalue">{{> core_form/element-passwordunmask-fill }}</span>
-                {{# pix }} t/passwordunmask-edit, core, {{# str }} passwordunmaskedithint, form {{/ str }}{{/ pix }}
-            </a>
-            <a href="#" data-passwordunmask="unmask" title="{{ unmaskhint }}">
-                {{# pix }} t/passwordunmask-reveal, core, {{# str }} passwordunmaskrevealhint, form {{/ str }}{{/ pix }}
-            </a>
-            <span data-passwordunmask="instructions" class="form-text text-muted" style="display: none;">
-                {{# str }} passwordunmaskinstructions, form {{/ str }}
-            </span>
-        </span>
-        <noscript>
-            <!-- Backwards compatability for Behat -->
-            <input  type="password"
+        <span data-passwordunmask="editor">
+            <input  type="hidden"
                     name="{{ name }}"
                     id="{{ id }}"
                     value="{{ value }}"
-                    size="{{ size }}"
+                    data-size="{{ size }}"
+                    class="form-control d-inline-block"
                     >
-        </noscript>
+        </span>
+        <a href="#" data-passwordunmask="edit" title="{{ edithint }}">
+            <span data-passwordunmask="displayvalue">{{> core_form/element-passwordunmask-fill }}</span>
+            {{# pix }} t/passwordunmask-edit, core, {{# str }} passwordunmaskedithint, form {{/ str }}{{/ pix }}
+        </a>
+        <a href="#" data-passwordunmask="unmask" title="{{ unmaskhint }}">
+            {{# pix }} t/passwordunmask-reveal, core, {{# str }} passwordunmaskrevealhint, form {{/ str }}{{/ pix }}
+        </a>
+        <span data-passwordunmask="instructions" class="form-text text-muted" style="display: none;">
+            {{# str }} passwordunmaskinstructions, form {{/ str }}
+        </span>
     </span>
 </div>
 {{#js}}
diff --git a/lib/form/amd/build/passwordunmask.min.js b/lib/form/amd/build/passwordunmask.min.js
index 16e9aa0fd09..01e08154728 100644
--- a/lib/form/amd/build/passwordunmask.min.js
+++ b/lib/form/amd/build/passwordunmask.min.js
@@ -1 +1 @@
-define(["jquery","core/templates"],function(a,b){var c=function(b){this.wrapperSelector='[data-passwordunmask="wrapper"][data-passwordunmaskid="'+b+'"]',this.wrapper=a(this.wrapperSelector),this.editorSpace=this.wrapper.find('[data-passwordunmask="editor"]'),this.editLink=this.wrapper.find('a[data-passwordunmask="edit"]'),this.editInstructions=this.wrapper.find('[data-passwordunmask="instructions"]'),this.displayValue=this.wrapper.find('[data-passwordunmask="displayvalue"]'),this.inputField=this.editorSpace.find(document.getElementById(b)),this.inputField.attr("type","hidden"),this.inputField.removeClass("hiddenifjs"),this.editInstructions.attr("id")||this.editInstructions.attr("id",b+"_instructions"),this.editInstructions.hide(),this.setDisplayValue(),this.addListeners()};return c.prototype.addListeners=function(){return this.wrapper.on("click keypress",'[data-passwordunmask="edit"]',a.proxy(function(b){"keypress"===b.type&&13!==b.keyCode||(b.stopImmediatePropagation(),b.preventDefault(),"hidden"!==this.inputField.attr("type")?"click"===b.type||a(b.relatedTarget).is(":input")?this.turnEditingOff(!1):this.turnEditingOff(!0):this.turnEditingOn())},this)),this.wrapper.on("click keypress",'[data-passwordunmask="unmask"]',a.proxy(function(a){"keypress"===a.type&&13!==a.keyCode||(a.stopImmediatePropagation(),a.preventDefault(),this.wrapper.data("unmasked",!this.wrapper.data("unmasked")),this.setDisplayValue())},this)),this.wrapper.on("keydown","input",a.proxy(function(a){"keydown"===a.type&&13!==a.keyCode||(a.stopImmediatePropagation(),a.preventDefault(),this.turnEditingOff(!0))},this)),this},c.prototype.checkFocusOut=function(b){this.isEditing()&&window.setTimeout(a.proxy(function(){var c=b.relatedTarget||document.activeElement;this.wrapper.has(a(c)).length||this.turnEditingOff(!a(c).is(":input,a"))},this),100)},c.prototype.passwordVisible=function(){return!!this.wrapper.data("unmasked")},c.prototype.isEditing=function(){return"hidden"!==this.inputField.attr("type")},c.prototype.turnEditingOn=function(){var b=this.getDisplayValue();return this.passwordVisible()?this.inputField.attr("type","text"):this.inputField.attr("type","password"),this.inputField.val(b),this.editInstructions.length&&(this.inputField.attr("aria-describedby",this.editInstructions.attr("id")),this.editInstructions.show()),this.wrapper.attr("data-passwordunmask-visible",1),this.editLink.hide(),this.inputField.focus().select(),a("body").on("focusout",this.wrapperSelector,a.proxy(this.checkFocusOut,this)),this},c.prototype.turnEditingOff=function(b){a("body").off("focusout",this.wrapperSelector,this.checkFocusOut);var c=this.getDisplayValue();return this.inputField.attr("type","hidden").attr("aria-describedby",null),this.inputField.val(c),this.editInstructions.hide(),this.wrapper.removeAttr("data-passwordunmask-visible"),this.editLink.show(),this.setDisplayValue(),b&&this.editLink.focus(),this},c.prototype.getDisplayValue=function(){return this.inputField.val()},c.prototype.setDisplayValue=function(){var c=this.getDisplayValue();return this.isEditing()&&(this.wrapper.data("unmasked")?this.inputField.attr("type","text"):this.inputField.attr("type","password"),this.inputField.val(c)),c&&this.wrapper.data("unmasked")?this.displayValue.text(c):(c||(c=""),b.render("core_form/element-passwordunmask-fill",{element:{frozen:this.inputField.is("[readonly]"),value:c,valuechars:c.split("")}}).done(a.proxy(function(a,c){this.displayValue.html(a),b.runTemplateJS(c)},this))),this},c});
\ No newline at end of file
+define(["jquery","core/templates"],function(a,b){var c=function(b){this.wrapperSelector='[data-passwordunmask="wrapper"][data-passwordunmaskid="'+b+'"]',this.wrapper=a(this.wrapperSelector),this.editorSpace=this.wrapper.find('[data-passwordunmask="editor"]'),this.editLink=this.wrapper.find('a[data-passwordunmask="edit"]'),this.editInstructions=this.wrapper.find('[data-passwordunmask="instructions"]'),this.displayValue=this.wrapper.find('[data-passwordunmask="displayvalue"]'),this.inputField=this.editorSpace.find(document.getElementById(b)),this.inputField.attr("type","hidden"),this.inputField.removeClass("hiddenifjs"),this.editInstructions.attr("id")||this.editInstructions.attr("id",b+"_instructions"),this.editInstructions.hide(),this.setDisplayValue(),this.addListeners()};return c.prototype.addListeners=function(){return this.wrapper.on("click keypress",'[data-passwordunmask="edit"]',a.proxy(function(b){"keypress"===b.type&&13!==b.keyCode||(b.stopImmediatePropagation(),b.preventDefault(),"hidden"!==this.inputField.attr("type")?"click"===b.type||a(b.relatedTarget).is(":input")?this.turnEditingOff(!1):this.turnEditingOff(!0):this.turnEditingOn())},this)),this.wrapper.on("click keypress",'[data-passwordunmask="unmask"]',a.proxy(function(a){"keypress"===a.type&&13!==a.keyCode||(a.stopImmediatePropagation(),a.preventDefault(),this.wrapper.data("unmasked",!this.wrapper.data("unmasked")),this.setDisplayValue())},this)),this.wrapper.on("keydown","input",a.proxy(function(a){"keydown"===a.type&&13!==a.keyCode||(a.stopImmediatePropagation(),a.preventDefault(),this.turnEditingOff(!0))},this)),this},c.prototype.checkFocusOut=function(b){this.isEditing()&&window.setTimeout(a.proxy(function(){var c=b.relatedTarget||document.activeElement;this.wrapper.has(a(c)).length||this.turnEditingOff(!a(c).is(":input,a"))},this),100)},c.prototype.passwordVisible=function(){return!!this.wrapper.data("unmasked")},c.prototype.isEditing=function(){return"hidden"!==this.inputField.attr("type")},c.prototype.turnEditingOn=function(){var b=this.getDisplayValue();return this.passwordVisible()?this.inputField.attr("type","text"):this.inputField.attr("type","password"),this.inputField.val(b),this.inputField.attr("size",this.inputField.attr("data-size")),this.editInstructions.length&&(this.inputField.attr("aria-describedby",this.editInstructions.attr("id")),this.editInstructions.show()),this.wrapper.attr("data-passwordunmask-visible",1),this.editLink.hide(),this.inputField.focus().select(),a("body").on("focusout",this.wrapperSelector,a.proxy(this.checkFocusOut,this)),this},c.prototype.turnEditingOff=function(b){a("body").off("focusout",this.wrapperSelector,this.checkFocusOut);var c=this.getDisplayValue();return this.inputField.attr("type","hidden").attr("aria-describedby",null),this.inputField.val(c),this.editInstructions.hide(),this.wrapper.removeAttr("data-passwordunmask-visible"),this.inputField.removeAttr("size"),this.editLink.show(),this.setDisplayValue(),b&&this.editLink.focus(),this},c.prototype.getDisplayValue=function(){return this.inputField.val()},c.prototype.setDisplayValue=function(){var c=this.getDisplayValue();return this.isEditing()&&(this.wrapper.data("unmasked")?this.inputField.attr("type","text"):this.inputField.attr("type","password"),this.inputField.val(c)),c&&this.wrapper.data("unmasked")?this.displayValue.text(c):(c||(c=""),b.render("core_form/element-passwordunmask-fill",{element:{frozen:this.inputField.is("[readonly]"),value:c,valuechars:c.split("")}}).done(a.proxy(function(a,c){this.displayValue.html(a),b.runTemplateJS(c)},this))),this},c});
\ No newline at end of file
diff --git a/lib/form/amd/src/passwordunmask.js b/lib/form/amd/src/passwordunmask.js
index 97a0b9e9243..dbd3b2f48ba 100644
--- a/lib/form/amd/src/passwordunmask.js
+++ b/lib/form/amd/src/passwordunmask.js
@@ -169,6 +169,7 @@ define(['jquery', 'core/templates'], function($, Template) {
             this.inputField.attr('type', 'password');
         }
         this.inputField.val(value);
+        this.inputField.attr('size', this.inputField.attr('data-size'));
 
         if (this.editInstructions.length) {
             this.inputField.attr('aria-describedby', this.editInstructions.attr('id'));
@@ -216,6 +217,9 @@ define(['jquery', 'core/templates'], function($, Template) {
         // Remove the visible attr.
         this.wrapper.removeAttr('data-passwordunmask-visible');
 
+        // Remove the size attr.
+        this.inputField.removeAttr('size');
+
         this.editLink.show();
         this.setDisplayValue();
 
diff --git a/lib/form/templates/element-passwordunmask.mustache b/lib/form/templates/element-passwordunmask.mustache
index 64c47a3994b..e5c094813c3 100644
--- a/lib/form/templates/element-passwordunmask.mustache
+++ b/lib/form/templates/element-passwordunmask.mustache
@@ -48,53 +48,36 @@
 {{< core_form/element-template }}
     {{$ element }}
         <div data-passwordunmask="wrapper" data-passwordunmaskid="{{ element.id }}">
-            <span class="visibleifjs">
-                <span data-passwordunmask="editor">
-                    <!-- The input in the noscript will be moved here as part of the page load -->
-                    <span data-passwordunmask="instructions" class="editinstructions">
-                        {{^ element.frozen }}
-                        {{# str }} passwordunmaskinstructions, form {{/ str }}
-                        {{/ element.frozen }}
-                    </span>
-                    <input  type="hidden"
-                            {{# element.frozen }}readonly{{/ element.frozen }}
-                            {{^ element.hardfrozen}} name="{{ element.name }}"{{/ element.hardfrozen }}
-                            id="{{ element.id }}"
-                            value="{{element.value }}"
-                            size="{{ element.size }}"
-                            {{# error }}
-                                autofocus aria-describedby="id_error_{{ element.name }}"
-                            {{/ error }}
-                            {{{ attributes }}}
-                            >
-                        </span>
+            <span data-passwordunmask="editor">
+                <!-- The input in the noscript will be moved here as part of the page load -->
+                <span data-passwordunmask="instructions" class="editinstructions">
+                    {{^ element.frozen }}
+                    {{# str }} passwordunmaskinstructions, form {{/ str }}
+                    {{/ element.frozen }}
                 </span>
-                {{^ element.frozen }}
-                <a href="#" data-passwordunmask="edit" title="{{ edithint }}">
-                {{/ element.frozen }}
-                    <span data-passwordunmask="displayvalue">{{> core_form/element-passwordunmask-fill }}</span>
-                {{^ element.frozen }}
-                    {{# pix }} t/passwordunmask-edit, core, {{ edithint }}{{/ pix }}
-                </a>
-                {{/ element.frozen }}
-                <a href="#" data-passwordunmask="unmask" title="{{ unmaskhint }}">
-                    {{# pix }} t/passwordunmask-reveal, core, {{ edithint }}{{/ pix }}
-                </a>
-            </span>
-            <noscript>
-                <!-- Backwards compatability for Behat -->
-                <input  type="password"
+                <input  type="hidden"
                         {{# element.frozen }}readonly{{/ element.frozen }}
                         {{^ element.hardfrozen}} name="{{ element.name }}"{{/ element.hardfrozen }}
                         id="{{ element.id }}"
                         value="{{element.value }}"
-                        size="{{ element.size }}"
+                        data-size="{{ element.size }}"
                         {{# error }}
                             autofocus aria-describedby="id_error_{{ element.name }}"
                         {{/ error }}
                         {{{ attributes }}}
                         >
-            </noscript>
+            </span>
+            {{^ element.frozen }}
+            <a href="#" data-passwordunmask="edit" title="{{ edithint }}">
+            {{/ element.frozen }}
+                <span data-passwordunmask="displayvalue">{{> core_form/element-passwordunmask-fill }}</span>
+            {{^ element.frozen }}
+                {{# pix }} t/passwordunmask-edit, core, {{ edithint }}{{/ pix }}
+            </a>
+            {{/ element.frozen }}
+            <a href="#" data-passwordunmask="unmask" title="{{ unmaskhint }}">
+                {{# pix }} t/passwordunmask-reveal, core, {{ edithint }}{{/ pix }}
+            </a>
         </div>
     {{/ element }}
 {{/ core_form/element-template }}
diff --git a/theme/boost/templates/core_admin/setting_configpasswordunmask.mustache b/theme/boost/templates/core_admin/setting_configpasswordunmask.mustache
deleted file mode 100644
index 257e81ff20c..00000000000
--- a/theme/boost/templates/core_admin/setting_configpasswordunmask.mustache
+++ /dev/null
@@ -1,75 +0,0 @@
-{{!
-    This file is part of Moodle - http://moodle.org/
-
-    Moodle is free software: you can redistribute it and/or modify
-    it under the terms of the GNU General Public License as published by
-    the Free Software Foundation, either version 3 of the License, or
-    (at your option) any later version.
-
-    Moodle is distributed in the hope that it will be useful,
-    but WITHOUT ANY WARRANTY; without even the implied warranty of
-    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-    GNU General Public License for more details.
-
-    You should have received a copy of the GNU General Public License
-    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
-}}
-{{!
-    @template core_admin/setting_configpasswordunmask
-
-    Admin password unmask setting template.
-
-    Context variables required for this template:
-    * name - form element name
-    * size - form element size
-    * value - form element value
-    * id - element id
-
-    Example context (json):
-    {
-        "name": "test",
-        "id": "test0",
-        "size": "8",
-        "value": "secret"
-    }
-}}
-<div class="form-password">
-    <span data-passwordunmask="wrapper" data-passwordunmaskid="{{ id }}">
-        <span class="visibleifjs">
-            <span data-passwordunmask="editor">
-                <input  type="hidden"
-                        name="{{ name }}"
-                        id="{{ id }}"
-                        value="{{ value }}"
-                        size="{{ size }}"
-                        class="form-control d-inline-block"
-                        >
-            </span>
-            <a href="#" data-passwordunmask="edit" title="{{ edithint }}">
-                <span data-passwordunmask="displayvalue">{{> core_form/element-passwordunmask-fill }}</span>
-                {{# pix }} t/passwordunmask-edit, core, {{# str }} passwordunmaskedithint, form {{/ str }}{{/ pix }}
-            </a>
-            <a href="#" data-passwordunmask="unmask" title="{{ unmaskhint }}">
-                {{# pix }} t/passwordunmask-reveal, core, {{# str }} passwordunmaskrevealhint, form {{/ str }}{{/ pix }}
-            </a>
-            <span data-passwordunmask="instructions" class="form-text text-muted" style="display: none;">
-                {{# str }} passwordunmaskinstructions, form {{/ str }}
-            </span>
-        </span>
-        <noscript>
-            <!-- Backwards compatability for Behat -->
-            <input  type="password"
-                    name="{{ name }}"
-                    id="{{ id }}"
-                    value="{{ value }}"
-                    size="{{ size }}"
-                    class="form-control d-inline-block"
-                    >
-        </noscript>
-    </span>
-</div>
-{{#js}}
-require(['core_form/passwordunmask'], function(PasswordUnmask) {
-    new PasswordUnmask("{{ id }}");
-});
-{{/js}}
diff --git a/theme/boost/templates/core_form/element-passwordunmask.mustache b/theme/boost/templates/core_form/element-passwordunmask.mustache
index e2147a8d5ee..56a5eeb18cd 100644
--- a/theme/boost/templates/core_form/element-passwordunmask.mustache
+++ b/theme/boost/templates/core_form/element-passwordunmask.mustache
@@ -48,53 +48,36 @@
 {{< core_form/element-template }}
     {{$ element }}
         <span data-passwordunmask="wrapper" data-passwordunmaskid="{{ element.id }}">
-            <span class="visibleifjs">
-                <span data-passwordunmask="editor">
-                    <input  type="hidden"
-                            {{# element.frozen }}readonly{{/ element.frozen }}
-                            {{^ element.hardfrozen}} name="{{ element.name }}"{{/ element.hardfrozen }}
-                            id="{{ element.id }}"
-                            value="{{ element.value }}"
-                            class="form-control d-inline-block {{# error }}form-control-danger{{/ error }}"
-                            size="{{ element.size }}"
-                            {{# error }}
-                                autofocus aria-describedby="id_error_{{ element.name }}"
-                            {{/ error }}
-                            {{{ attributes }}}
-                            >
-                </span>
-                {{^ element.frozen }}
-                <a href="#" data-passwordunmask="edit" title="{{ edithint }}">
-                {{/ element.frozen }}
-                    <span data-passwordunmask="displayvalue">{{> core_form/element-passwordunmask-fill }}</span>
-                {{^ element.frozen }}
-                    {{# pix }} t/passwordunmask-edit, core, {{# str }} passwordunmaskedithint, form {{/ str }}{{/ pix }}
-                </a>
-                {{/ element.frozen }}
-                <a href="#" data-passwordunmask="unmask" title="{{ unmaskhint }}">
-                    {{# pix }} t/passwordunmask-reveal, core, {{# str }} passwordunmaskrevealhint, form {{/ str }}{{/ pix }}
-                </a>
-                <span data-passwordunmask="instructions" class="form-text text-muted" style="display: none;">
-                    {{^ element.frozen }}
-                    {{# str }} passwordunmaskinstructions, form {{/ str }}
-                    {{/ element.frozen }}
-                </span>
-            </span>
-            <noscript>
-                <!-- Backwards compatability for Behat -->
-                <input  type="password"
+            <span data-passwordunmask="editor">
+                <input  type="hidden"
                         {{# element.frozen }}readonly{{/ element.frozen }}
                         {{^ element.hardfrozen}} name="{{ element.name }}"{{/ element.hardfrozen }}
                         id="{{ element.id }}"
                         value="{{ element.value }}"
                         class="form-control d-inline-block {{# error }}form-control-danger{{/ error }}"
-                        size="{{ element.size }}"
+                        data-size="{{ element.size }}"
                         {{# error }}
                             autofocus aria-describedby="id_error_{{ element.name }}"
                         {{/ error }}
                         {{{ attributes }}}
                         >
-            </noscript>
+            </span>
+            {{^ element.frozen }}
+            <a href="#" data-passwordunmask="edit" title="{{ edithint }}">
+            {{/ element.frozen }}
+                <span data-passwordunmask="displayvalue">{{> core_form/element-passwordunmask-fill }}</span>
+            {{^ element.frozen }}
+                {{# pix }} t/passwordunmask-edit, core, {{# str }} passwordunmaskedithint, form {{/ str }}{{/ pix }}
+            </a>
+            {{/ element.frozen }}
+            <a href="#" data-passwordunmask="unmask" title="{{ unmaskhint }}">
+                {{# pix }} t/passwordunmask-reveal, core, {{# str }} passwordunmaskrevealhint, form {{/ str }}{{/ pix }}
+            </a>
+            <span data-passwordunmask="instructions" class="form-text text-muted" style="display: none;">
+                {{^ element.frozen }}
+                {{# str }} passwordunmaskinstructions, form {{/ str }}
+                {{/ element.frozen }}
+            </span>
         </span>
     {{/ element }}
 {{/ core_form/element-template }}