Adopt `generateHexString` instead of varios `Math#random`

Adopt `generateHexString` instead of varios `Math.random()` in various
places.

`Math#random` maybe faster than `window#crypto#getRadomValues` but there is value on having a centralised way to generate random hex strings.

src/annotator/annotation-sync.js

+import { generateHexString } from '../shared/random';
+
 /**
  * @typedef {import('../shared/bridge').Bridge<GuestToSidebarEvent,SidebarToGuestEvent>} SidebarBridge
  * @typedef {import('../types/annotator').AnnotationData} AnnotationData
@@ -108,7 +110,7 @@ export class AnnotationSync {
     if (annotation.$tag) {
       return annotation;
     }
-    tag = tag || window.btoa(Math.random().toString());
+    tag = tag || generateHexString(8);
     Object.defineProperty(annotation, '$tag', {
       value: tag,
     });

src/annotator/hypothesis-injector.js

 import { parseJsonConfig } from '../boot/parse-json-config';
+import { generateHexString } from '../shared/random';
 import { onDocumentReady, FrameObserver } from './frame-observer';
 
 /**
@@ -67,7 +68,7 @@ export class HypothesisInjector {
       parseJsonConfig(document);
 
     // Generate a random string to use as a frame ID. The format is not important.
-    const subFrameIdentifier = Math.random().toString().replace(/\D/g, '');
+    const subFrameIdentifier = generateHexString(10);
     const injectedConfig = {
       ...this._config,