I'm creating a password reset form for use by staff at a school using Google Apps for Education. I'm using the HTMLService API to import an html file and use it as a template. Part of that file is this table:
<table id=passwords>
<tr>
<td>New Password</td>
<td>
<input name='password1' id='password1' type='password'/>
</td>
</tr>
<tr>
<td>Confirm New Password</td>
<td>
<input name='password2' id='password2' type='password'/>
</td>
</tr>
</table>
When I display this as a gadget on a Google Sites page, the type='password'
is lost from the html, so passwords aren't hidden when the user types them in:
<table id="passwords-caja-guest-0___">
<tbody><tr>
<td>New Password</td>
<td>
<input autocomplete="off" id="password1-caja-guest-0___" name="password1">
</td>
</tr>
<tr>
<td>Confirm New Password</td>
<td>
<input autocomplete="off" id="password2-caja-guest-0___" name="password2">
</td>
</tr>
</tbody></table>
I can shift to using UIService instead, which has a password input widget that does hide the password, but then the other folks that are going to maintain the site after me will also have to learn UIService's rather lengthy API.
So, I'm looking for ideas on how to hide the password input in this context (i.e. just show asterisks or bullets when the user types in a password).
Congratulations! You have filed the very first bug on the new HtmlService :).
It seems that type=password is lost on the sanitization step. It's filed as bug 1487
As a workaround, this will work fine today.
<input name='password1' id='password1' />
<script>document.getElementById('password1').type='password'</script>
That is, setting the type yourself in JavaScript is working. This is only a temporary workaround though; we will fix the underlying bug asap. Thanks for the report.
Update: The underlying bug has been fixed in Caja and we will pick it up in the next Apps Script release.