[FIX] website, web_editor: fix form ids generation

Commit [1] modified the function that generates HTML ids, unfortunately
this was not done correctly and should have been done in all versions
since 14.0. This commit fixes that by bringing the benefits that commit
[1] brings (correction so that HTML Ids don't start with a number) but
without the defaults that it has.
See the related discussion here [2].

[1]: https://github.com/odoo/odoo/commit/3dde03308d4adffd861570230edcef1c5f7fc1c4
[2]: https://github.com/odoo/odoo/pull/80217#discussion_r787975515

task-2760205

closes odoo/odoo#84474

X-original-commit: 105f80e57cacf48dcdafc41dc3d1cf418c75311e
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

addons/web_editor/static/src/js/common/utils.js

@@ -340,16 +340,10 @@ function _isColorGradient(value) {
  * Generates a string ID.
  *
  * @private
- * @param {integer} length the length of the generated ID.
  * @returns {string}
  */
-function _generateHTMLId(length) {
-    let result = '';
-    const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
-    while (result.length < length) {
-        result += characters.charAt(Math.floor(Math.random() * characters.length));
-    }
-    return result;
+function _generateHTMLId() {
+    return `o${Math.random().toString(36).substring(2, 15)}`;
 }
 /**
  * Returns the class of the element that matches the specified prefix.

addons/web_editor/static/src/js/editor/snippets.options.js

@@ -2161,7 +2161,7 @@ const ListUserValueWidget = UserValueWidget.extend({
     _onAddCustomItemClick() {
         let id;
         if (this.el.dataset.generateIdForNewItems) {
-            id = generateHTMLId(30);
+            id = generateHTMLId();
         }
         if (this.el.dataset.newElementsToggled) {
             this.selected.push(id);

addons/website/static/src/snippets/s_social_media/options.js

@@ -9,7 +9,7 @@ options.registry.SocialMedia = options.Class.extend({
      * @override
      */
     async willStart() {
-        this.$target[0].querySelectorAll(':scope > a').forEach(el => el.setAttribute('id', generateHTMLId(30)));
+        this.$target[0].querySelectorAll(':scope > a').forEach(el => el.setAttribute('id', generateHTMLId()));
         await this._super(...arguments);
         let websiteId;
         this.trigger_up('context_get', {

addons/website/static/src/snippets/s_website_form/options.js

@@ -127,7 +127,7 @@ const FormEditor = options.Class.extend({
      */
     _renderField: function (field, resetId = false) {
         if (!field.id) {
-            field.id = generateHTMLId(30);
+            field.id = generateHTMLId();
         }
         const template = document.createElement('template');
         template.innerHTML = qweb.render("website.form_field_" + field.type, {field: field}).trim();