@autobusal/common 1.34.0 → 1.34.1

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 1.34.1 (2026-08-29)
+
+- Meta's stale-tag cleanup can no longer remove a tag React owns: it now identifies leftovers by having existed before React rendered, not by comparing values (Sentry BUSMAGUS-7 - on a prerendered page the leftover and the live tag carry the same value, so the old comparison deleted React's own node and the next navigation crashed on removeChild).
+
 ## 1.34.0 (2026-08-29)
 
 - Calendar renders one month per page - the neighbouring months' days are blank padding now, so a grid no longer shows two different 1sts and 31sts.

package/Meta.tsx

@@ -46,19 +46,42 @@ const withBrand = (value: string): string => (brand ? `${ value } - ${ brand }`
 // title alone; a description/canonical duplicate is worse, since crawlers
 // commonly pick the FIRST occurrence, which is the potentially-stale one.
 //
-// This makes Meta the sole owner of every tag it manages: for each one, if
-// it has a current value, keep the element carrying that value and remove
-// every other element matching the same selector; if it has no value for
-// this page (description/keywords/image are optional), remove all of
-// them, since nothing here can claim the page has one.
-// Edited: Ferjolt Ozuni - Date: 2026-08-02
-// `values` (plural) is for tags that legitimately repeat - the hreflang
-// alternates. With a single `value` the cleanup below keeps one element and
-// deletes the rest, which for alternates would throw away every language but
-// one. With `values` it keeps every element whose attribute is in the set,
-// which is exactly React's own current output, and removes only the leftovers
-// a prerendered snapshot brought with it.
-type OwnedTag = { selector: string, attr: 'text' | string, value?: string, values?: string[] };
+// This makes Meta the sole owner of every tag it manages: whatever was
+// carrying one of these before React rendered goes, and React's own output
+// is all that is left. Edited: Claude - 2026-08-29 - it used to decide that
+// by VALUE (keep the element whose value matches this page, drop the rest),
+// which is what BUSMAGUS-7 turned out to be; see preReactHeadTags below.
+// A selector is all this needs now: the hreflang alternates, which
+// legitimately repeat, need no special case either, because the rule is no
+// longer "keep one of them".
+
+/**
+ * Every head tag that existed BEFORE React rendered anything.
+ *
+ * Edited: Claude - Date: 2026-08-29 (Sentry BUSMAGUS-7)
+ *
+ * The cleanup below could not tell a leftover prerendered tag from React's
+ * own freshly hoisted one, so it compared VALUES and kept the first match
+ * in document order. On a prerendered page those values are identical by
+ * construction - the snapshot was produced by this very component - and the
+ * first match is always the snapshot's, sitting in the served HTML. So the
+ * cleanup kept the dead tag and removed REACT'S: the fiber went on holding
+ * a detached node, and the next navigation's unmount reached
+ * `n.parentNode.removeChild(n)` with a null parent. That is BUSMAGUS-7,
+ * thrown from React 19's HostHoistable deletion path, on a
+ * /bus-lines/... URL - and it aborts the navigation in flight, which is
+ * what the DOM-corruption watchdog in @autobusal/providers then has to
+ * paper over with a full reload.
+ *
+ * This module is evaluated before the first <Meta> can render, and
+ * `createRoot` (unlike `hydrateRoot`) never adopts existing markup - so
+ * anything captured here is provably NOT React's, and anything React
+ * hoists later is provably not in here. Identity instead of value: the
+ * cleanup can now only ever remove tags React does not own.
+ */
+const preReactHeadTags: Set<Element> = new Set(
+  typeof document === 'undefined' ? [] : document.head.querySelectorAll('title, meta, link')
+);
 
 // Edited: Ferjolt Ozuni - Date: 2026-07-31
 // Bug: this ran on EVERY render of EVERY <Meta> usage (no dependency array),
@@ -86,7 +109,7 @@ type OwnedTag = { selector: string, attr: 'text' | string, value?: string, value
 // is the sole owner of this part of the DOM.
 let hasCleanedPrerenderedTags = false;
 
-const useSoleMetaOwnership = (tags: OwnedTag[]): void => {
+const useSoleMetaOwnership = (selectors: string[]): void => {
   useEffect(() => {
     if (hasCleanedPrerenderedTags) {
       return;
@@ -94,33 +117,21 @@ const useSoleMetaOwnership = (tags: OwnedTag[]): void => {
 
     hasCleanedPrerenderedTags = true;
 
-    tags.forEach(({ selector, attr, value, values }) => {
-      const elements = [...document.querySelectorAll(`head > ${ selector }`)];
-
-      if (values !== undefined) {
-        const keep = new Set(values);
-
-        elements.forEach(el => {
-          if (!keep.has(el.getAttribute(attr) ?? '')) {
-            el.remove();
-          }
-        });
-
-        return;
-      }
-
-      if (value === undefined) {
-        elements.forEach(el => el.remove());
-        return;
-      }
-
-      const mine = elements.find(el => (
-        attr === 'text' ? el.textContent === value : el.getAttribute(attr) === value
-      ));
-
-      elements.forEach(el => {
-        if (el !== mine) {
-          el.remove();
+    /*
+     * Edited: Claude - Date: 2026-08-29 (Sentry BUSMAGUS-7)
+     *
+     * Remove the tags that were here before React was, and nothing else.
+     * React has already committed its own copy of every tag this component
+     * owns by the time this effect runs, so a leftover is by definition one
+     * of the nodes captured above - no value comparison needed, and none
+     * possible: on a prerendered page the leftover and the live tag carry
+     * the SAME value, which is precisely how the old comparison came to
+     * delete React's own node. See the note on preReactHeadTags.
+     */
+    selectors.forEach(selector => {
+      document.querySelectorAll(`head > ${ selector }`).forEach(element => {
+        if (preReactHeadTags.has(element)) {
+          element.remove();
         }
       });
     });
@@ -273,22 +284,22 @@ const Meta = ({ title, keywords, description, image, url, type = 'website', noIn
   const alternates = useAlternates(noIndex, url);
 
   useSoleMetaOwnership([
-    { selector: 'title', attr: 'text', value: fullTitle },
-    { selector: 'meta[name="robots"]', attr: 'content', value: robots },
-    { selector: 'meta[name="keywords"]', attr: 'content', value: keywords },
-    { selector: 'meta[name="description"]', attr: 'content', value: description },
-    { selector: 'link[rel="canonical"]', attr: 'href', value: canonicalUrl },
-    { selector: 'link[rel="alternate"][hreflang]', attr: 'href', values: alternates.map(item => item.href) },
-    { selector: 'meta[property="og:type"]', attr: 'content', value: type },
-    { selector: 'meta[property="og:title"]', attr: 'content', value: fullTitle },
-    { selector: 'meta[property="og:description"]', attr: 'content', value: description },
-    { selector: 'meta[property="og:image"]', attr: 'content', value: resolvedImage },
-    { selector: 'meta[property="og:url"]', attr: 'content', value: canonicalUrl },
-    { selector: 'meta[property="og:site_name"]', attr: 'content', value: brand },
-    { selector: 'meta[name="twitter:card"]', attr: 'content', value: 'summary_large_image' },
-    { selector: 'meta[name="twitter:title"]', attr: 'content', value: fullTitle },
-    { selector: 'meta[name="twitter:description"]', attr: 'content', value: description },
-    { selector: 'meta[name="twitter:image"]', attr: 'content', value: resolvedImage }
+    'title',
+    'meta[name="robots"]',
+    'meta[name="keywords"]',
+    'meta[name="description"]',
+    'link[rel="canonical"]',
+    'link[rel="alternate"][hreflang]',
+    'meta[property="og:type"]',
+    'meta[property="og:title"]',
+    'meta[property="og:description"]',
+    'meta[property="og:image"]',
+    'meta[property="og:url"]',
+    'meta[property="og:site_name"]',
+    'meta[name="twitter:card"]',
+    'meta[name="twitter:title"]',
+    'meta[name="twitter:description"]',
+    'meta[name="twitter:image"]'
   ]);
   usePageviewTracking(location.pathname + location.search, fullTitle);
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@autobusal/common",
-  "version": "1.34.0",
+  "version": "1.34.1",
   "author": "Ferjolt Ozuni",
   "type": "module",
   "main": "index.ts"