feature: allow embed <replay-web-page> to also support updating favicons from replay (#287)

It may be useful to be able to have <replay-web-page> embed also take
over the favicons for the page, propagating them from the replay (eg. if
in a single page app where replay takes up most of the view).

This PR adds a `updateFavicons` attribute, used as `<replay-web-page ...
updateFavicons>` to have icons propagated from the replay to the
top-level frame. (This may be especially useful with `deepLink` option,
which allows for linking directly to archived pages)

Details:
  - enabled via 'updateFavicons' attribute on <replay-web-page>
- pass icons via postMessage() update, adding type to embed message to
allow different types of message
  - currently supporting 'urlchange' and 'favicons' message types
- add shared updateFaviconLinks() in misc.ts, used by both embed and
main app

---------
Co-authored-by: emma <hi@emma.cafe>

src/appmain.ts

@@ -14,6 +14,7 @@ import {
   IS_APP,
   VERSION,
   clickOnSpacebarPress,
+  updateFaviconLinks,
 } from "./misc";
 
 import fasHelp from "@fortawesome/fontawesome-free/svgs/solid/question-circle.svg";
@@ -24,6 +25,7 @@ import "./item";
 import "./item-index";
 import "./chooser";
 import { type LoadInfo } from "./item";
+import type { FavIconEventDetail } from "./types";
 
 // ===========================================================================
 @customElement("replay-app-main")
@@ -480,21 +482,8 @@ export class ReplayWebApp extends LitElement {
     }
   }
 
-  // @ts-expect-error [// TODO: Fix this the next time the file is edited.] - TS7006 - Parameter 'event' implicitly has an 'any' type.
-  onFavIcons(event) {
-    const head = document.querySelector("head")!;
-    const oldLinks = document.querySelectorAll("link[rel*='icon']");
-
-    for (const link of oldLinks) {
-      head.removeChild(link);
-    }
-
-    for (const icon of event.detail.icons) {
-      const link = document.createElement("link");
-      link.rel = icon.rel;
-      link.href = icon.href;
-      head.appendChild(link);
-    }
+  onFavIcons(event: CustomEvent<FavIconEventDetail>) {
+    updateFaviconLinks(event.detail);
   }
 
   // @ts-expect-error [// TODO: Fix this the next time the file is edited.] - TS7006 - Parameter 'event' implicitly has an 'any' type.