Provide a mechanism to get a random string, suitable for element IDs

1. +++ b/core/misc/drupal.es6.js
   @@ -570,4 +570,23 @@ window.Drupal = { behaviors: {}, locale: {} };
   +  Drupal.randomString = function () {
   

   This can be an arrow.

2. +++ b/core/misc/drupal.es6.js
   @@ -570,4 +570,23 @@ window.Drupal = { behaviors: {}, locale: {} };
   +    return btoa(buffer.reduce((hash, byte) => {
   +      return hash.concat(String.fromCharCode(byte));
   +    }, ``));
   

   This is just returning the result of hash.concat(), you can drop the curly braces. Something like, return btoa(buffer.reduce((hash, byte) => hash.concat(String.fromCharCode(byte)), ''));

3. +++ b/core/misc/drupal.es6.js
   @@ -570,4 +570,23 @@ window.Drupal = { behaviors: {}, locale: {} };
   +    }, ``));
   

   Instead of ``, it can be '' since no replacements are happening.

Before falling into similar pitfalls as we did in PHP I would suggest to either name this cryptographic safe or not. The implementation reads like this, but the usecase in the issue summary seems to not require that. Maybe it is enough to rename the method to cryptographicRandomString or so?

I'm curious, should we have something like drupal_html_id() like in PHP instead? This way at least its obvious what this function is build for.

@dawehner I think it's probably a good idea to mark this as not cryptographically safe. That's not its intended use case, but it is much better than the horribly broken Math.random(). I think a name change on the method and some additional documentation would be nice.

Thank you for clarifying the indented usecase!

It is a bit weird though we say: The length might change at any moment.Wouldn't many usecases for a random string function return a fixed length? Random example for that: A test.

+++ b/core/misc/drupal.es6.js
@@ -570,4 +570,26 @@ window.Drupal = { behaviors: {}, locale: {} };
+   * use where uniqueness is a requirement. For example, this method might be

I might be missing something but I can't see how uniqueness is guaranteed. The PHP equivalent had issues because we didn't guarantee this.

@alexpott - I took a brief look into this. From the Mozilla docs,

The RandomSource.getRandomValues() method lets you get cryptographically strong random values. The array given as the parameter is filled with random numbers (random in its cryptographic meaning).

To guarantee enough performance, implementations are not using a truly random number generator, but they are using a pseudo-random number generator seeded with a value with enough entropy.

+++ b/core/misc/drupal.es6.js
@@ -570,4 +570,26 @@ window.Drupal = { behaviors: {}, locale: {} };
+   * will return a string that is guaranteed to be random that is suitable for

Perhaps we can just change this line to to something like, guaranteed to be pseudo-random, which is kind of strange.

@dawehner - We could just trim this string to a fixed length?

We're doing this in our front-end JS. Not sure if it's helpful but thought I'd share.

function randomString(length = 6) {
  let result = "";
  const characters = `ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789`;
  const charactersLength = characters.length;
  for (let i = 0; i < length; i++) {
    result += characters.charAt(Math.floor(Math.random() * charactersLength));
  }
  return result;
}

This issue is being reviewed by the kind folks in Slack, #needs-review-queue-initiative. We are working to keep the size of Needs Review queue [2700+ issues] to around 400 (1 month or less), following Review a patch or merge request as a guide.

Think this may need more discussion. From what I've learned on the php tests, when doing comparisions, is that we can't use random strings even if there is a 1 and million chance it could produce duplicates. So if the goal is to create a unique ID could it check if the random ID it generated exists already, if so generate another?