Avoid formatting with the iso8601 calendar, because Node 22 does it wrong.

Author: jyasskin

webserver/e2e/history.spec.ts

@@ -113,14 +113,13 @@ test("Save history", async ({
 
   await page.getByRole("button", { name: "🍲" }).click();
 
-  const ym = Temporal.Now.plainDateISO().toPlainYearMonth();
+  const today = Temporal.Now.plainDateISO();
   await expect(
     page.locator("#cooking-history").getByRole("listitem")
   ).toHaveText([
-    ym.toLocaleString("en", {
+    today.toLocaleString("en", {
       month: "short",
       year: "numeric",
-      calendar: ym.calendarId,
     }),
     "Apr 2023",
   ]);

webserver/src/components/HistoryList.tsx

@@ -17,8 +17,9 @@ import { OneRecipe, type RecipeTitleWithLinkFields } from "./OneRecipe";
 import { QueryDrivenTextField } from "./QueryDrivenTextField";
 
 function formatMonth(m: Temporal.PlainYearMonth) {
-  return m.toLocaleString(undefined, {
-    calendar: m.calendarId,
+  // Avoid using the PlainYearMonth's calendar, which is probably iso8601, because Node 22 formats
+  // it differently from the default Gregorian calendar.
+  return m.toPlainDate({ day: 1 }).toLocaleString(undefined, {
     year: "numeric",
     month: "short",
   });

webserver/src/pages/r/[username]/[slug].astro

@@ -248,15 +248,15 @@ if (cookingHistoryAddResult?.error) {
                   <li>
                     <time
                       datetime={ym.toString()}
-                      title={`${ym.toLocaleString("en", {
-                        month: "short",
-                        calendar: ym.calendarId,
-                      })} ${andList.format(days.sort(numericAscending).map(String))}`}
+                      title={`${ym
+                        .toPlainDate({ day: 1 })
+                        .toLocaleString("en", {
+                          month: "short",
+                        })} ${andList.format(days.sort(numericAscending).map(String))}`}
                     >
-                      {ym.toLocaleString("en", {
+                      {ym.toPlainDate({ day: 1 }).toLocaleString("en", {
                         month: "short",
                         year: "numeric",
-                        calendar: ym.calendarId,
                       })}
                     </time>
                   </li>