Merge branch 'main' into availableinworker-6-cases

.github/workflows/prod-build.yml

@@ -238,10 +238,14 @@ jobs:
           REACT_APP_MDN_PLUS_10Y_PLAN: price_1KeG02JNcmPzuWtRlrSiLTI6
 
           # Surveys.
-          REACT_APP_SURVEY_START_WEB_APP_AUGUST_2024: 1722816000000 # new Date("2024-08-05Z").getTime()
-          REACT_APP_SURVEY_END_WEB_APP_AUGUST_2024: 1723593600000 # new Date("2024-08-14Z").getTime()
-          REACT_APP_SURVEY_RATE_FROM_WEB_APP_AUGUST_2024: 0.0
-          REACT_APP_SURVEY_RATE_TILL_WEB_APP_AUGUST_2024: 0.05 # 5%
+          REACT_APP_SURVEY_START_HOMEPAGE_FEEDBACK_2024: 1731369600000 # new Date("2024-11-12Z").getTime()
+          REACT_APP_SURVEY_END_HOMEPAGE_FEEDBACK_2024: 1732665600000 # new Date("2024-11-27Z").getTime()
+          REACT_APP_SURVEY_RATE_FROM_HOMEPAGE_FEEDBACK_2024: 0.0
+          REACT_APP_SURVEY_RATE_TILL_HOMEPAGE_FEEDBACK_2024: 1 # 100%
+          REACT_APP_SURVEY_START_WEBDX_EDITING_2024: 1731628800000 # new Date("2024-11-15Z").getTime()
+          REACT_APP_SURVEY_END_WEBDX_EDITING_2024: 1732320000000 # new Date("2024-11-23Z").getTime()
+          REACT_APP_SURVEY_RATE_FROM_WEBDX_EDITING_2024: 0.0
+          REACT_APP_SURVEY_RATE_TILL_WEBDX_EDITING_2024: 0.1 # 10%
 
           # Telemetry.
           REACT_APP_GLEAN_CHANNEL: prod

build/check-images.ts

@@ -133,7 +133,10 @@ export function checkImageReferences(
           // might be something like `screenshot.png` for the sake of rendering
           // it now, we still want the full relative URL.
           img.attr("src", absoluteURL.pathname);
-        } else {
+        } else if (
+          absoluteURL.hostname !== "mdn.github.io" ||
+          !absoluteURL.pathname.startsWith("/shared-assets/")
+        ) {
           addImageFlaw(img, src, {
             explanation: "External image URL",
             externalImage: true,

build/flaws/broken-links.ts

@@ -71,7 +71,9 @@ function mutateLink(
       "summary"
     );
     $element.attr("title", titleWhenMissing);
+    const href = $element.attr("href");
     $element.attr("href", null);
+    $element.attr("data-href", href);
   }
 }
 

client/pwa/package.json

@@ -13,7 +13,7 @@
   },
   "dependencies": {
     "@zip.js/zip.js": "2.7.53",
-    "dexie": "4.0.9"
+    "dexie": "4.0.10"
   },
   "devDependencies": {
     "@types/dexie": "1.3.35",

client/pwa/yarn.lock

@@ -363,18 +363,18 @@ commander@^2.20.0:
   integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
 
 cross-spawn@^7.0.3:
-  version "7.0.3"
-  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
-  integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
+  version "7.0.5"
+  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.5.tgz#910aac880ff5243da96b728bc6521a5f6c2f2f82"
+  integrity sha512-ZVJrKKYunU38/76t0RMOulHOnUcbU9GbpWKAOZ0mhjr7CX6FVrH+4FrAapSOekrgFQ3f/8gwMEuIft0aKq6Hug==
   dependencies:
     path-key "^3.1.0"
     shebang-command "^2.0.0"
     which "^2.0.1"
 
-dexie@*, dexie@4.0.9:
-  version "4.0.9"
-  resolved "https://registry.yarnpkg.com/dexie/-/dexie-4.0.9.tgz#8c4e827815a84ef4fdc6aa7923f89ea2cda87610"
-  integrity sha512-VQG1huEVSAdDZssb9Bb9mFy+d3jAE0PT4d1nIRYlT46ip1fzbs1tXi0SlUayRDgV3tTbJG8ZRqAo2um49gtynA==
+dexie@*, dexie@4.0.10:
+  version "4.0.10"
+  resolved "https://registry.yarnpkg.com/dexie/-/dexie-4.0.10.tgz#979e3ee75993b44eea3852f97ceb198019d5b287"
+  integrity sha512-eM2RzuR3i+M046r2Q0Optl3pS31qTWf8aFuA7H9wnsHTwl8EPvroVLwvQene/6paAs39Tbk6fWZcn2aZaHkc/w==
 
 electron-to-chromium@^1.5.41:
   version "1.5.50"

client/src/document/hooks.ts

@@ -51,6 +51,7 @@ export function useCollectSample(doc: any) {
 export function useRunSample(doc: Doc | undefined) {
   const isServer = useIsServer();
   const locale = useLocale();
+  const { hash } = useLocation();
 
   useEffect(() => {
     if (isServer) {
@@ -61,18 +62,15 @@ export function useRunSample(doc: Doc | undefined) {
       return;
     }
     document.querySelectorAll("iframe").forEach((iframe) => {
-      const src = new URL(iframe.src || "", "https://example.com");
-      if (!(src && src.pathname.toLowerCase().endsWith(`/runner.html`))) {
-        return null;
-      }
-      const id = src.searchParams.get("id");
+      const id = iframe.getAttribute("data-live-id") || null;
+      const path = iframe.getAttribute("data-live-path") || "/";
       if (!id) {
         return null;
       }
 
       const r =
-        getCodeAndNodesForIframeBySampleClass(id, src.pathname) ||
-        getCodeAndNodesForIframe(id, iframe, src.pathname);
+        getCodeAndNodesForIframeBySampleClass(id, path) ||
+        getCodeAndNodesForIframe(id, iframe, path);
       if (r === null) {
         return null;
       }
@@ -91,9 +89,10 @@ export function useRunSample(doc: Doc | undefined) {
         code,
         locale
       );
-      initPlayIframe(iframe, code);
+      const fullscreen = hash === `#livesample_fullscreen=${id}`;
+      initPlayIframe(iframe, code, fullscreen);
     });
-  }, [doc, isServer, locale]);
+  }, [doc, isServer, locale, hash]);
 }
 
 export function useDecorateCodeExamples(doc: Doc | undefined) {

client/src/document/index.scss

@@ -14,6 +14,8 @@
   h4,
   h5,
   h6 {
+    font-variant-ligatures: no-contextual;
+
     a:link,
     a:visited {
       color: var(--text-primary);

client/src/document/ingredients/browser-compatibility-table/feature-row.tsx

@@ -15,6 +15,7 @@ import {
 } from "./utils";
 import { LEGEND_LABELS } from "./legend";
 import { DEFAULT_LOCALE } from "../../../../../libs/constants";
+import { BCD_TABLE } from "../../../telemetry/constants";
 
 function getSupportClassName(
   support: SupportStatementExtended | undefined,
@@ -545,7 +546,11 @@ export const FeatureRow = React.memo(
         `/${locale}/docs`
       );
       titleNode = (
-        <a href={href} className="bc-table-row-header">
+        <a
+          href={href}
+          className="bc-table-row-header"
+          data-glean={`${BCD_TABLE}: link -> ${href}`}
+        >
           {title}
           {compat.status && <StatusIcons status={compat.status} />}
         </a>